我们经常遇到JS 跨域的问题,跨域的解决方案有很多,JSONP是非常常用的跨域解决方案,这里封装了一下JSONP:
?
function getJSONP(url, callback) { if (!url) { return; } var a = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j']; //定义一个数组以便产生随机函数名 var r1 = Math.floor(Math.random() * 10); var r2 = Math.floor(Math.random() * 10); var r3 = Math.floor(Math.random() * 10); var name = 'getJSONP' + a[r1] + a[r2] + a[r3]; var cbname = 'getJSONP.' + name; //作为jsonp函数的属性 if (url.indexOf('?') === -1) { url += '?jsonp=' + cbname; } else { url += '&jsonp=' + cbname; } var script = document.createElement('script'); //定义被脚本执行的回调函数 getJSONP[name] = function (e) { try { //alert(e.name); callback && callback(e); } catch (e) { // } finally { //最后删除该函数与script元素 delete getJSOP[name]; script.parentNode.removeChild(script); } } script.src = url; document.getElementsByTagName('head')[0].appendChild(script); } getJSONP('http://localhost:8888/',function(response){ alert(response.name); });
?
?
服务器端代码:
<?php echo $_GET['jsonp']."({name:'Hi,Kingwell,I come from China',age:20})"; ?>
?注:服务器端代码必须是函数名加括号格式,括号里就是JSON格式数据。
?
?
?