初识jsonp

1.这个理解为一种协议，传递的数据格式是json 2.浏览器跨域无法访问，会报安全错误，但是想<script src=>,<img src=> 这些标签加载回来的js和图片，则可以进行从其他域名获取到 3.跟ajax不同，ajax只能访问当前域名(不包括服务器使用代理等情况) 4.示例1 假如当前域名 www.current.com <head> <script type="text/javascript" src="http://bankServer.com/getBankCard.js"></script> </head> 远程的getBankCard.js的内容alert("从远程获取bankCard成功"); 则会弹出窗口示例2,执行本地的js方法 <head> <script type="text/javascript"> var showBank = function(data){ alert('我是本地函数：' + data.bankName); }; </script> <script type="text/javascript" src="http://bankServer.com/getBankCard.js"></script> </head> getBankCard.js内容如下 showBank( { "userId": 1,"bankUserName": "隔壁老王","bankName": "XX银行" }); 弹出窗口且有打印示例3，动态传递回调方法名 <head> <script type="text/javascript"> // 得到航班信息查询结果后的回调函数 var showBank = function(data){ alert('我是本地函数：' + data.bankName); }; // 提供jsonp服务的URL地址（不管是什么类型的地址，最终生成的返回值都是一段javascript代码） // 请求参数部分，callback=showBank，key不一定非得是callback，跟后台服务能对应上就行 var url = "http://bankServer.com/api/getBankCard?bindId=2&callback=showBank"; // 创建script标签，设置其属性 var script = document.createElement('script'); script.setAttribute('src',url); // 把script标签加入head，此时调用开始 document.getElementsByTagName('head')[0].appendChild(script); </script> </head> 这个请求就是把查到的结果包装成上面示例2的形式返回

初识jsonp

相关文章