ASP.NET网站中实现Ajax的跨域请求

1. 什么是同源策略
   同源策略是浏览器的一个安全功能，不同源(同源是指协议、端口和域名完全相同)的客户端脚本在没有明确授权的情况下不能读写对方资源。只要网站的协议名(Protocol)、主机名(Host)、端口名(Port)这三个中任意一个不同，网站之间的资源请求就会受到同源策略的限制

2. 什么是跨域请求
   凡是不符合同源策略的请求，都属于跨域请求。为了保证安全性，通常浏览器会对跨域请求作出限制。
   通常情况下限制以下几种行为：

   1).Cookie、LocalStorage 和 IndexDB 无法读取
   2).DOM 和JS对象无法获得
   3).AJAX请求不能发送
   

3. 常见跨域场景

   URL                                      说明                    是否允许通信
   http://www.domain.com/a.js
   http://www.domain.com/b.js         同一域名，不同文件或路径           允许
   http://www.domain.com/lab/c.js
   
   
   http://www.domain.com:8000/a.js
   http://www.domain.com/b.js         同一域名，不同端口                不允许
    
    
   http://www.domain.com/a.js
   https://www.domain.com/b.js        同一域名，不同协议                不允许
    
    
   http://www.domain.com/a.js
   http://192.168.4.12/b.js           域名和域名对应相同ip              不允许
    
    
   http://www.domain.com/a.js
   http://x.domain.com/b.js           主域相同，子域不同                不允许
   http://domain.com/c.js
    
    
   http://www.domain1.com/a.js
   http://www.domain2.com/b.js        不同域名                         不允许
   

4. 跨域请求的方法

   1)JSONP
   通常情况下我们在使用Ajax请求时，会使用JSON格式的字符串进行信息的传递，JSON和JSONP是完全不同的内容，在JSONP的字符串中，通常比JSON格式的字符串多了一个CallBack的函数名。
   JSON格式

   {
   	"code":"1991",
   	"price":1991,
   	"tickets":5
   };
   

   JSONP格式

   flightHandler(
   {
   	"code":"1991",
   	"price":1991,
   	"tickets":5
   }
   );
   

   一般情况系我们不用制定Callback函数的名称，系统会自动生成一个长字符串作为该Callback的唯一标识。
   要解决跨域问题，在ASP.NET服务器端，我们通常使用一般处理文件来对请求进行响应，如下所示：

   public class ServerResponseHandler : IHttpHandler
   {
   
       List<MyDataTest> myDataTestList;
       public void ProcessRequest(HttpContext context)
       {
           context.Response.ContentType = "text/plain";
           //该行函数必须是在JSONP类型的请求中才不会报错，通过获取系统自动生成的callBack字符串来标识当前请求。
           string callback = context.Request.Params["callBack"].TrimEnd().ToString();
           myDataTestList = new List<MyDataTest>
           {
              new MyDataTest
              {
                   name = "数据1",
                   type = "类型1",
                   state = "状态1",
              },
              new MyDataTest
              {
                   name = "数据2",
                   type = "类型2",
                   state = "状态2",
              },
           };
           string json = Newtonsoft.Json.JsonConvert.SerializeObject(myDataTestList);
           json = callback + "(" + json + ")";
           context.Response.Write(json);
       }
   
       public bool IsReusable
       {
           get
           {
               return false;
           }
       }
   }
   
   public class MyDataTest
   {
       public string name;
       public string type;
       public string state;
   }
   

   在客户端的前端通过Ajax进行请求

   <script src="Scripts/jquery-3.3.1.js" type="text/javascript"></script>
   <script>
       function GetJson() {
           $.ajax({
               url: "http://localhost:55222/ServerResponseHandler.ashx",
               dataType: "jsonp",
               //这里不需要制定JSONP的CallBack函数名，通过系统自动生成并加入到URL请求中来完成。
               success: function (data) {
                   alert(data[0].name);//这里data通常已经转化为JSON字符串所指向的类实例，可以通过类的方式直接获取相关值。
                   alert(JSON.stringify(data));  //也可以通过该行代码将对象实例再次转化为JSON供其他部分使用。
               }
           });
       }
   </script>
   

   相关源码下载地址
   JSONP只支持GET请求，不支持POST请求。

   2)跨域资源共享（CORS）
   跨域资源共享(Cross-Origin Resource Sharing)定义了一重跨域访问的机制，可以让Ajax实现跨域问题，该功能的实现只需服务器发送一个响应标头即可。

   Access-Control-Request-Method
   Access-Control-Request-Headers
   

   查看相关文章
   查看相关文档

   3)window.name+iframe
   4)window.postMessage()
   5)WebSocket
   6)Nodejs中间件代理跨域
   7)location.hash + iframe跨域
   8)document.domain + iframe跨域
   后续几种可参考以下链接
   链接1
   链接2