JSONP

day23 JSONP及练习讲解

浏览器的同源策略

浏览器的一个安全策略、对于对应的服务器请求的接口地址有对应的防护（请求不通 异步请求）导致跨域。

同源策略包含的内容

• 协议一致 （http和https会产生跨域）

• 端口号一致

• ip一致

跨域问题产生的原因

由于同源策略会产生跨域

• 协议不一致

• 端口号不一致

• IP地址不一致

文件资源访问也会产生跨域

• 对应的资源位置不一致（ftp和http的影响）

跨域问题解决

在响应的时候添加相应的响应头（Access-Control-Allow-Origin）

response.setResponseHeader('Access-Control-Allow-Origin）','*')
response.setResponseHeader('Access-Control-Allow-Origin-Methd）','*')

使用客户端和服务端的配合 JSONP

• 服务端提供的接口为jsonp

• 客户端通过对应的script标签不受跨域影响的特性来接收对应的数据

使用代理

• devserve 代理（vue提供的 测试）

• 服务器代理 nginx

跨域问题是因为对应的tcp/udp来导致的 所以如果要解决你可以不使用tcp/udp 使用webScroket（即使通信）

JSONP

JSONP是一种解决跨域的方法，它实际上也是一个get请求，他利用对应的script标签不受跨域影响的限制来解决对应的跨域问题（带对应的href src 等的标签都不受跨域的影响 script link farmes 等）

JSONP 解决跨域必须具备的点

后端接口必须为jsonp接口

前台使用script src链入的方式，通过传入对应的回调函数来接收