Vue项目中使用jsonp抓取跨域数据的方法
(编辑:jimmy 日期: 2024/11/9 浏览:3 次 )
- 下载jsonp npm install jsonp
- 在js文件夹下新增一个jsonp.js,来封装一个jsonp()
如何封装一个jsonp()
在下载的jsopn中,jsonp(url,options,callback)这个是原生jsonp方法中的参数;
引入下载的jsonp
import originJsonp from 'jsonp';
导出自己定义的jsonp函数
//这个jsonp函数是我们自己定义的,与上面的originJsonp不是同一个,originJsonp是一个可以直接引用的方法;她最
终返回一个Promise对象
export default function jsonp(url, data, option){ return new Promise((resolve,reject)=>{ //调用originJsonp()来抓取数据 originJsonp(url,option,(err,data)=>{ //callback是抓取数据结果 if(!err){ resolve(data) }ese{ reject(err) } }) }) }
在抓取的数据URL中常常会有参数传入,但是这些参数是对象格式,但是我们传入到originJsonp方法中的参数是拼接到url后面的,所以不能是对象的格式,这时就需要将对象格式的参数拼接到url后面组成新的URL
类似这样的一个url:( https://www.baidu.com/s"htmlcode">
ie:utf-8, rsv_bp:1 } export function param(data){ let urlData=''; for(let key in data){ let value = data[k] !== undefined "htmlcode">export default function jsonp(url, data, option) { return new Promise((resolve,reject)=>{ //调用跨域请求函数 //对URL进行拼接,首页需要判断URL后面是否有“?”,如果有这需要给param(data)添加“&”,不然需要给param(data)添加“?” url = url.indexOf('"color: #ff0000">总结以上所述是小编给大家介绍的Vue项目中使用jsonp抓取跨域数据的方法,希望对大家有所帮助!
下一篇:webpack4 optimization使用总结
几个月来,英特尔、微软、AMD和其它厂商都在共同推动“AI PC”的想法,朝着更多的AI功能迈进。在近日,英特尔在台北举行的开发者活动中,也宣布了关于AI PC加速计划、新的PC开发者计划和独立硬件供应商计划。
在此次发布会上,英特尔还发布了全新的全新的酷睿Ultra Meteor Lake NUC开发套件,以及联合微软等合作伙伴联合定义“AI PC”的定义标准。
在此次发布会上,英特尔还发布了全新的全新的酷睿Ultra Meteor Lake NUC开发套件,以及联合微软等合作伙伴联合定义“AI PC”的定义标准。