详细解密jsonp跨域请求_javascript技巧

来源：动视网责编：小采时间：2020-11-27 21:36:59

详细解密jsonp跨域请求_javascript技巧

详细解密jsonp跨域请求_javascript技巧:1.什么是跨域请求：服务器A上的一个页面，要请求服务器B上的一个处理程序，这就叫做跨域请求本次的测试页面为：处理程序kimhandler.ashx，如下： %@ WebHandler Language=C# Class=KimHandler %> using System; usi

推荐度：

点击下载本文 文档为doc格式

导读详细解密jsonp跨域请求_javascript技巧:1.什么是跨域请求：服务器A上的一个页面，要请求服务器B上的一个处理程序，这就叫做跨域请求本次的测试页面为：处理程序kimhandler.ashx，如下： %@ WebHandler Language=C# Class=KimHandler %> using System; usi

1.什么是跨域请求：

服务器A上的一个页面，要请求服务器B上的一个处理程序，这就叫做跨域请求

本次的测试页面为：

处理程序kimhandler.ashx，如下：

%@ WebHandler Language="C#" Class="KimHandler" %>

using System;
using System.Web;

public class KimHandler : IHttpHandler {
 
 public void ProcessRequest (HttpContext context)
 {
 string msg = "{\"name\":\"kim\",\"gender\":\"男\",\"age\":24}";
 context.Response.Write(msg);
 }
 
 public bool IsReusable {
 get {
 return false;
 }
 }
}

另一张处理程序handler.ashx如下：

<%@ WebHandler Language="C#" Class="Handler" %>

using System;
using System.Web;

public class Handler : IHttpHandler {
 
 public void ProcessRequest (HttpContext context)
 {
 string callbackName = context.Request.Params["callbackFun"];
 string msg = callbackName+ "({\"name\":\"kim\",\"age\":\"18\"});";
 context.Response.Write(msg);
 }
 
 public bool IsReusable {
 get {
 return false;
 }
 }

}

2.Ajax无法实现跨域请求

查看监视器，发现没有返回任何请求报文体

3.使用script标签，可以实现跨域请求

测试代码如下：

查看监视器，可以看到，有返回请求报文体

在用json格式看下

4.使用js方式，在浏览器端，读取响应是数据

测试代码如下，注意换了一个处理程序





 
 
 function getData(data) {
 for (var key in data) {
 alert(data[key]);
 }
 }

通过后台代码，可知

然后在监视器上看看

发现在浏览器端，弹出了kim还有18

5.使用Jq来实现跨域请求（内部原理就是为我们创建了一个script标签）

代码如下

点击按钮后，可以看到效果，再看下监视器

以上所述就是本文的全部内容了，希望大家能够喜欢。

详细解密jsonp跨域请求_javascript技巧

推荐度：

点击下载本文 文档为doc格式

标签： js javascript js脚本

热门焦点

详细解密jsonp跨域请求_javascript技巧

详细解密jsonp跨域请求_javascript技巧

详细解密jsonp跨域请求_javascript技巧

最新推荐

猜你喜欢

热门推荐