跨域请求和JSONP

Cross Domain Request：从一个资源请求另一个资源，二者所在的请求地址不同，域名不同、端口号不同、请求协议不同。

提示：localhost和127.0.0.1也算跨域！

浏览器允许跨域请求的情形：

IMG、LINK、SCRIPT、IFRAME...

浏览器禁止跨域请求的情形：

XHR——浏览器处于安全考虑，禁用了XHR的跨域请求（其实服务器给出了响应消息，但浏览器不让使用）

如何解决浏览器的XHR跨域请求限制—— 八种方案：

(1)

(2)百度一下,你就知道

(3)

(4)

(5)

(6)

(7)修改响应消息头部，添加Access-Control-Allow-Origin头部

header(“Access-Control-Allow-Origin: 要跨域的url”)

(8)使用JSONP——非常巧妙

JSON:JavaScript Object Notation，是一种字符串数据格式(羊肉)。

JSONP：JSONwith Padding，填充式JSON，与JSON完全两码事，是一种使用JSON数据的方式(把羊肉红烧)。意思是在JSON字符串左右添加函数名：doResponse({"ename":"Tom", "age":20});

JSONP是专用于解决XHR跨域限制一种手段。基本原理：使用动态创建的一个SCRIPT标签代替XHR发起异步请求，要求服务器必须返回application/javascript，立即在客户端执行——要执行的函数本体在客户端浏览器中声明。

src="url" async>

async: 浏览器请求该script内容时不会阻塞当前页面中的内容

sync  同步

async 异步

服务器端接收客户端(页面)提交的callback

在用接收的callback的数据 包一下要实际要传输的数据

jQuery中如何使用JSONP发起异步请求：

(1)$.getJSON()

用途1：使用XHR发起异步请求(不能跨域)

$.getJSON('url', doResponse)

用途2：使用JSONP发起跨域异步请求

$.getJSON('http://跨域地址/?callback=?', doResponse)

第二个问号jQuery会动态创建一个函数名 这个函数名的作用就是自动调后面的函数(doResponse)

(2) $.ajax()

用途1：使用XHR发起异步请求(不能跨域)

$.ajax({  })

用途2：使用JSONP发起跨域异步请求

$.ajax({dataType: 'jsonp'})

后端处理看语言 一般更改为允许跨域即可