基础名词解释：
跨域是基于浏览器对 javascript 同源策略的限制的解决之法。
关于同源，即协议，域名及端口需一致。
跨域方法：
1.jsonp，一种双方约定的信息传递的方法。
我们知道，通常在调用 js 文件（<script src="">），图片（<img src="">）或框架（<iframe>）的时候不受跨域的影响，因此可以将需要 res 的数据装进 server 的 js 文件内，用以 client req。
该协议的要点就是允许用户传递一个 callback 参数给服务器。
2.服务端代理&配置 CORS
请求头 Access-Control-Allow-Origin 设置 "*" 或指定IP / Access-Control-Allow-Methods（GET, POST, PUT, DELETE，OPTIONS）
nginx&apache.etc
演示：
1.jsonp，注意调用的顺序，实际项目需动态创建。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <div id='testdiv'></div> <script type="text/javascript"> var message = function(data) { //window['message'] = fn; 避免 message/jsonpCallback 未定义 alert(data[1].title); }; var url = "https://files.cnblogs.com/files/yuqlblog/cross-domain.js"; //https://files.cnblogs.com/demo.html?callback=message var script = document.createElement('script'); script.setAttribute('src',url); document.getElementsByTagName('body')[0].appendChild(script); </script> </body> </html>
1.1. jsonp 基于 jquery 的跨域，只能是 get 请求（jsonp 的局限：get，安全风险）。
jsonp：传递给请求处理程序或页面的，用以获得 jsonp 回调函数名的参数名，默认为 callback
jsonpCallback：自定义的 jsonp 回调函数名称，默认为 jQuery 自动生成的随机函数名，指定 jsonpCallback 时可以将回调函数写在 ajax 外面做其他操作。
正常返回数据：
{ "success": [{ "id": 1, "title": "title 1" }, { "id": 2, "title": "title 2" }, { "id": 3, "title": "title 3"}] }
e.g.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="./js/jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ var name = 'chenshishuo'; var sex = 'man'; var address = 'shenzhen'; var looks = 'handsome '; $.ajax({ type : 'get', url:'http://192.168.31.137/train/test/testjsonp', data : { name : name, sex : sex, address : address, looks : looks, }, cache :false, jsonp: "callback", // GET&POST 请求中 URL 参数里的 "callback=?"，可改 jsonpCallback:"success", dataType : 'jsonp', success:function(data){ alert(data); }, error:function(data){ alert('error'); } }); }); </script> </head> <body> <input id='inputtest' value='546' name='inputtest'> <div id='testdiv'></div> </body> </html>
在使用默认 jsonp 名称，即 callback，和默认随机回调函数名时，服务器需要这样返回数据示例：
Response.ContentType="text/html; charset=utf-8"; String callback = Request.QueryString["callback"].ToString(); Response.Write(callback + "{ "success": [{ "id": 1, "title": "title 1" }, { "id": 2, "title": "title 2" }, { "id": 3, "title": "title 3"}] }");
2.iframe跨子域，以及代理