标签：data javascrip win AC 服务端 跨域 pre code hand
要谈jsonp，首先要弄明白jsonp是什么，它是用来干嘛的。jsonp其实就是我们常用的script标签，用来解决跨域的，只不过这个标签是动态创建的，为啥要动态创建涅。
举个小栗子：
假如我们远程文件remote.js是这样的：
handle({result:‘我是远程文件派来的数据‘})
我们在本地中这样引入：
<script type="text/javascript"> var handle= function(data){ alert(data.result); }; </script> <script type="text/javascript" src="跨域服务器/remote.js"></script>
这样就可以把远程文件的result弹出来。那么问题来了，远程js不知道他要调用的本地js函数名怎么办？所以，我们就动态创建一个script，把远程要调用的函数名用callback参数给服务端传过去，相当于告诉服务端，你要调用的本地函数名在callback参数里。像这样
<script type="text/javascript"> var handle= function(data){ alert(data.result); }; var script = document.createElement(‘script‘); script.src = ‘跨域服务器/remote?callback=‘ + handle +‘&n=‘ + Math.random(); </script>
这样一个简易版的jsonp 就算实现了，当然，其实还是可以进行封装一下的，这样想用的时候只要调用就行了:
function jsonp(url, data = {}, callback = ‘callback‘) {
function handle(param) {
var str = ‘‘; //处理参数
for (var key in param) {
str = str + ‘&‘ + key + ‘=‘ + param[key];
}
return str;
}
return new Promise(function (resolve, reject) {
var script = document.createElement(‘script‘);
window[callback] = function (json) {
if (json) {
resolve(json);
}
}
script.src = url + ‘?callback=‘ + callback + handle(data) + ‘&n=‘ + Date.now();
document.body.appendChild(script);
})
}
标签：data javascrip win AC 服务端 跨域 pre code hand
原文地址：https://www.cnblogs.com/renbo/p/9130980.html
