JS:Jsonp跨域请求数据

2019-07-25  本文已影响0人  觉上云来

Jsonp:


var JsonpUtil = {

toQueryurl:function(o) {

var arr = [];

        for (var i in o) {

arr.push(encodeURIComponent(i)+'=' +encodeURIComponent(o[i]))

}

return arr.join('&')

}

};

var jsonpDate =function jsonp(params) {

var callbackName='json_'+ ~~(Math.random()*100); // 随机生成回调函数名称

    params.data.callback = callbackName;//注意

    var script = document.createElement('script');

    var flag = params.url.indexOf('?')>-1?'&':'?';

    var queryUrl = params.url + flag + JsonpUtil.toQueryurl(params.data);

    var head = document.getElementsByTagName('head')[0];

    head.appendChild(script);

    script.src = queryUrl;

    //回调函数要接口返回后执行

    window[callbackName] =function(json) {

window[callbackName] =null;

        clearTimeout(script.timer);

        head.removeChild(script);

        params.success && params.success(json)

};

    //超时处理

    if (params.timer) {

script.timer =setTimeout(function(){

window[callbackName] =null;

            head.removeChild(script);

            params&¶ms.error({

message:'网络超时'

            })

},params.timer)

}

};

Object.prototype.$Jsonp =jsonpDate;

/*以上代码复制到自己JS文件中即可,ps("注意定义名称相同")*/

/*以下为调用实例*/

var  obj =new Object();

obj.$Jsonp({

url:'https://douban.uieee.com//v2/movie/top250',

    data:{

page:1

    },

    success:function (res) {

console.log(res);

    },

    error:function () {

console.log(error)

}

})

上一篇 下一篇

猜你喜欢

热点阅读