学习JSONP

最近自己研究跨域调用js,然后发现有jsonp 这种技术,在Jquery中可以使用,于是研究下原理

发现: 其实就是利用<script>的跨域访问的能力. 调用服务端返回的一段字符串这段字符串很有特点必须是一个"函数",例如 A({'data':'111'})

例子返回一个这个函数,这明显是就是调用 A函数,并传入数值....于是想到如果我的页面上有个处理函数例如 A(data){ alert(data.data)};

那么我的 A函数就会被调用.... alert 出 111 来.

对这就是实现的原理

下面写一下 jquery的用法:

1  $.getJSON('http://www.test.com:3448/ProcessJSONPTest.ashx?callback=?', function (data) {
2                 alert(data.a);
3             });

View Code

callback=? 这是必须写的如果不这么写 jquery认为不是跨域请求将无法发送请求

服务端拼接字符串的处理:

 1  public class ProcessJSONPTest : IHttpHandler
 2     {
 3 
 4         public void ProcessRequest(HttpContext context)
 5         {
 6             context.Response.ContentType = "text/plain";
 7             //context.Response.Write("Hello World");
 8             if (!string.IsNullOrEmpty(context.Request["callback"]))
 9             {
10                 string callback = context.Request["callback"];
11                 System.Web.Script.Serialization.JavaScriptSerializer javaScriptSerializer=new JavaScriptSerializer();
12                 string str= javaScriptSerializer.Serialize(new {a = 100, b = 200});
13                 //此处要和客户端 执行函数配置 不然无法调用
14                 context.Response.Write(string.Format("{0}({1})",callback,str));
15             }
16         
17         }
18 
19         public bool IsReusable
20         {
21             get
22             {
23                 return false;
24             }
25         }
26     }

View Code

其他的用法和ajax 异步没区别