1.实现原理
1.把接口写在 script标签的src 中 这个接口就可以访问(不会存在跨域问题 因为接口在浏览器地址栏是可以访问的 会返回json字符串);
2.直接写不可以 因为正常情况下 scr请求来的是可执行的js代码 此时返回的是json对象 所以程序报错;
3.src后拼接callback函数参数 返回的json对象就会跑到 这个函数的参数中 (原因不明觉厉);
4.然后就可以在这个函数中 操作请求来的 json对象了 完成;
2.代码实现
????//如果函数名，全是一个，任何的业务，都是回调这一个了 ???????var callbackName = ‘callback_‘ + Date.now(); ?//声明唯一的函数名 ???????var myUrl = url + ‘?callback=‘ + callbackName; //拼接src的路径 ???????//创建标签 ???????var script = document.createElement(‘script‘); ???????script.src = myUrl; //不会发请求 ????//挂载全局函数 ???????window[callbackName] = function(data) { ?//假设callbackName=‘a‘,服务器回写: a(‘数据‘) ???????????console.log(data); ???????????delete window[callbackName]; //删除window上一堆时间戳的函数 保持性能 ??????} ???//插入到body中,触发请求
??? document.body.appendChild(script);3.封装成函数
function jsonpFn(url,callback){ var callbackName = ‘callback_‘ + Date.now(); ???? var script = document.createElement(‘script‘); ??? script.src = url + ‘?callback=‘ + callbackName; ??? window[callbackName] = function(data) { ?????????callback(); ?????????delete window[callbackName]; ???? document.body.appendChild(script)}
//调用
jsonp("https://api.douban.com/v2/movie/in_theaters",function(res){
//res 为请求来的数据
//根据业务操作res ?
})关于jsonp跨域的 实现
原文地址：https://www.cnblogs.com/var-chu/p/9347576.html