JSONP 跨域

2017-08-14  本文已影响0人  leocz

1.什么是同源策略

同源策略(Same origin Policy):浏览器出于安全性考虑,只允许与本域下的接口交互,不同源的客户端脚本在没有明确授权的情况下,不能读写对方的资源。

如果协议,端口(如果指定了一个)和域名对于两个页面是相同的,则两个页面具有相同的源。
例如:http://store.company.com/dir/page.html

URL 结果 原因
http://store.company.com/dir2/other.html 同源
http://store.company.com/dir/inner/another.html 同源
https://store.company.com/secure.html 不同源 协议不同
http://store.company.com:81/dir/etc.html 不同源 端口不同
http://news.company.com/dir/other.html 不同源 域名不同

2.什么是跨域?跨域有几种实现形式

跨域就是向不同源的地址请求资源或者是进行操作。常见的形式有:jsonp,cores,postMassage,降域。

3.JSONP的原理是什么?

JSONP(JSON with Padding):jsonp不是json数据,JSON是一种数据格式,而JSONP是一种数据调用方式,是解决JSON跨域获取的解决方案。因此JSONP其实是一个非官方的协议。

4.CORS是什么?

CORS 全称是跨域资源共享(Cross-Origin Resource Sharing),是一种 ajax 跨域请求资源的方式,支持现代浏览器,IE支持10以上。 实现方式很简单,当你使用 XMLHttpRequest 发送请求时,浏览器发现该请求不符合同源策略,会给该请求加一个请求头:Origin,后台进行一系列处理,如果确定接受请求则在返回结果中加入一个响应头:Access-Control-Allow-Origin; 浏览器判断该相应头中是否包含 Origin 的值,如果有则浏览器会处理响应,我们就可以拿到响应数据,如果不包含浏览器直接驳回,这时我们无法拿到响应数据。

具体实现方式:

  1. 当使用 XMLHttpRequest 发送请求时,浏览器发现该请求不符合同源策略,会给该请求加一个请求头:Origin,后台进行一系列处理
  2. 如果确定接受请求则在返回结果中加入一个响应头:Access-Control-Allow-Origin
  3. 浏览器判断该相应头中是否包含 Origin 的值,包含则处理响应,我们成功拿到返回的数据。不包含则由于同源策略的限制,无视响应,我们无法拿到数据

CORS分为简单请求和需预检的请求:

 Accept   Accept-Language    Content-Language    Last-Event-ID   
                                                                                  
 Content-Type:只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

5.演示三种以上跨域的方法

链接各种跨域实现

上一篇下一篇

猜你喜欢

热点阅读