查看: 595|回复: 0

[JavaScript/JQuery] JSONP(Json with padding)

发表于 2017-10-4 09:22:43
尚学堂AD

JSONP:一种非官方跨域数据交互协议

JSONP怎么产生的

JSONP的原理

看上面的来源加以理解

上面说过了,script是不受跨域影响的

那么我们可以在我们代码中引用B服务器的文件

  1. 1 <script type="text/javascript" src="http://demo.com/jsonp/demoResult.aspx?callback=jsonpCallback"></script>
复制代码

在B服务器端demoResult.aspx会根据我们传的callback参数jsonpCallback自动返回数据

  1. //怎么个意思呢,将处理完的json放入<br>jsonpCallback(json);
复制代码

在我们A端,有一个创建一个函数

  1. 1 function jsonpCallback(data){
  2. 2 ................
  3. 3 };
复制代码

那么,当B服务器返回jsonpCallback(json);的时候不就正好调用了A端的jsonpCallback函数吗,数据也从B服务器传到A了

样例

jQuery支持JSONP协议

下面是其中的一种方式

  1. [/code]
  2. [code] 1 $.ajax({
  3. 2 type:"get",
  4. 3 async : false,
  5. 4 url:"http://demo.com/jsonp/demoResult.aspx?profileId=0001",
  6. 5 dataType :"jsonp",
  7. 6 jsonp:"callback",
  8. 7 jsonpCallback:"demoHandler",
  9. 8 success:function (json) {
  10. 9 alert(json);
  11. 10 },
  12. 11 error:function () {
  13. 12 alert("Fail!");
  14. 13 }
  15. 14 })
复制代码
  1. [/code]
  2. <p> </p>
  3. [code]
复制代码



回复

使用道具 举报