首先,先介绍下jsonp的跨域原理:
1、 动态创建script标签2、 利用 script 的src属性,会自动发送请求3、 只需要将要请求的地址设置为 script标签的src属性的值4、 需要服务端的接口配合,必须返回 JSONP 格式的数据才行 注意:
1、 需要有个支持 JSONP 请求的接口地址2、 我们指定回调函数的名称3、 我们写一个 与回调函数名称 相同的函数4、 通过这个函数的参数就可以获取到服务器返回的数据了!!!5、 这个函数只能写在全局环境中!!
1 function jsonp(url, params, callback) { 2 url += ‘?‘; 3 4 for(var k in params) { 5 url += k + ‘=‘ + params[k] + ‘&‘ 6 } 7 8 // 随机生成一个不重复的函数名 9 var callbackName = ‘ivy_‘ + (new Date - 0); 10 url += ‘callback=‘ + callbackName; 11 // 根据生成的函数名,让这个函数称为一个全局函数 12 window[callbackName] = function( data ) { 13 // console.log( data ); 14 callback( data ); 15 16 // 获取到数据后,就可以将script标签以及函数都销毁掉 17 document.head.removeChild( script ); 18 delete window[callbackName]; 19 }; 20 21 // 动态创建script 22 // 浏览器会自动发送请求,请求接口 23 var script = document.createElement(‘script‘); 24 script.src = url; 25 document.head.appendChild( script ); 26 27 }
时间: 2024-11-05 22:45:29