简单封装一个jsonp跨域请求数据

安利一个很好用的jsonp随时用,随时引。下面是这个jsonp.js文件

function jsonp(obj){
return new Promise((resolve,reject)=>{
    let opt = {
        url:'',
        data:{},
        callback:'callback',
        fnName:('jQuery'+Date.now()+'_'+Math.random()).replace('.','')
    }
    Object.assign(opt,obj);

    let fnName = opt.fnName;
    
    //随机一个不重名的函数名
    if(window.onOff === undefined) window.onOff = false;
    if(window.onOff === false){
        window.onOff = true;
        opt[fnName] = setTimeout(function(){
            // console.log(1)
            reject('请求超时');
        },10000);
    }
    
    window[fnName] = function (data){ //全局函数
        // opt.success(data);
        clearTimeout(opt[fnName]);
        delete window[fnName];
        window.onOff = false;
        resolve(data);
        console.dir(window);
    }
   
    //把对象转成字符串
    let arr = [];
    opt.data[opt.callback] = fnName;
    for(let attr of Object.keys(opt.data)){
        arr.push( attr + '=' + opt.data[attr]);
    }
    opt.data = arr.join('&'); 
    
    let oS = document.createElement('script');
    oS.src = opt.url + '?'+ opt.data; //+ '&' + opt.callback +'=' + fnName;
    document.getElementsByTagName('head')[0].appendChild(oS);
    oS.remove();
});
}
export default jsonp;

###使用
引一下jsonp.js文件

jsonp({
url:'需要请求数据的url',
data:{
 key:value,//key 为?查询信息的key,value为查询信息的value,有几个写几个;
 callback:cb
 }).then(e=>{
 console.log(e) //e就是我们需要的数据
 }) 
})
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值