JSONP(JSON with Padding)是一种跨域数据交互协议,它利用了`<script>`标签可以跨域请求资源的特性,来实现JavaScript从一个域名获取数据并处理的能力。在本实例中,我们将深入探讨如何使用jQuery调用ASHX(ASP.NET HTTP Handler)文件返回的JSONP数据,并对这些数据进行处理。 我们需要理解jQuery的`$.ajax`或`$.getJSON`函数如何支持JSONP。当`dataType`参数设置为"jsonp"时,jQuery会自动添加一个名为`callback`的查询参数到URL中,其值是动态生成的一个函数名。服务器接收到请求后,会将数据包裹在这个函数名之内返回,形如`functionName({data})`,JavaScript在接收到响应后,会执行这个函数,从而实现数据的处理。 接下来,我们来看ASHX文件的角色。在ASP.NET中,ASHX文件是一种轻量级的HTTP处理器,用于处理自定义的HTTP请求。在JSONP的场景下,ASHX处理程序接收请求,解析请求中的`callback`参数,然后将数据以JSON格式返回,并将其包裹在`callback`指定的函数名中。 以下是一个简单的jQuery JSONP请求示例: ```javascript $.ajax({ url: 'http://example.com/ashx/data.ashx', dataType: 'jsonp', success: function(data) { console.log('接收到的数据:', data); // 在这里处理接收到的JSON数据 }, error: function(jqXHR, textStatus, errorThrown) { console.error('请求失败:', textStatus, errorThrown); } }); ``` 在ASHX处理程序中,你需要读取请求中的`callback`参数,然后将数据包装成如下的格式: ```csharp public void ProcessRequest(HttpContext context) { string callback = context.Request.QueryString["callback"]; string jsonData = "{\"name\":\"John\", \"age\":30, \"city\":\"New York\"}"; context.Response.ContentType = "application/json"; context.Response.Write(callback + "({" + jsonData + "});"); } ``` 在上面的例子中,jQuery发送请求到ASHX处理器,处理器返回的响应是`callback`函数名加上JSON格式的数据,例如`myCallback({"name":"John", "age":30, "city":"New York"})`。当浏览器接收到这个响应后,会把它当作JavaScript代码执行,执行`myCallback`函数,从而将JSON数据传递给JavaScript代码处理。 总结一下,JSONP是一种解决跨域数据交互的技术,通过jQuery的`$.ajax`或`$.getJSON`函数配合`dataType: 'jsonp'`设置,可以方便地从ASHX等服务器端接口获取并处理数据。在服务器端,我们需要根据请求中的`callback`参数构造响应,将数据包裹在指定的函数中返回。这个实例提供了从ASHX文件获取JSONP数据的具体操作方法,对于理解JSONP工作原理和实际应用非常有帮助。
- 1
- wy123ans2014-07-10呵呵,很受用哦
- 粉丝: 672
- 资源: 95
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助