CORS & CSP笔记

1.CORS & CSP

浏览器跨域相关的安全策略主要存在于两个方面:

  1. 浏览器是否发送ajax
  2. 浏览器是否加载返回数据

假设从a.com 向b.com发送ajax请求。此时浏览器当前页面为a.com,浏览器发送ajax,去获取b.com的资源。具体请求过程如下:

  1. a.com通过添加 Content-Security-Policy头设置CSP策略来限制请求是否发出。浏览器发送获取资源请求之前,先读取当前页面的Content-Security-Policy参数,检查请求目的地址b.com是否符合CSP策略,如果符合则发出该ajax请求,如果不符合,则丢弃该请求并报CSP 错误。

     * Content-Security-Policy: default-src 'self' 仅仅允许访问当前域名,无法发送
     * Content-Security-Policy: *.b.com 允许发送
    
  2. b.com通过设置跨域资源共享CORS策略来限制浏览器是否加载b.com返回的数据。 浏览器成功发送ajax给b.com后,b.com收到请求并返回带有Access-Control-Allow-Origin头的数据包,浏览器先检查a.com是否在Access-Control-Allow-Origin允许范围之内,如果不在,则报CORS错误并不在当前页面加载这次返回的数据。实际上,不管b.com是否配置CORS头,浏览器此时都收到了完整的数据包,浏览器只是通过CORS策略来决定是否呈现返回的数据。

     * Access-Control-Allow-Origin * 允许加载任意来源请求,请求成功
     * Access-Control-Allow-Origin http://c.com 只允许来自c.com的请求,请求失败
    

Origin header注意点:
Origin header是浏览器添加的。如果一个request中,有origin header,并不一定是一次跨域请求,但是所有跨域请求都 会包含origin header.
Refer: https://stackoverflow.com/questions/15988323/cors-and-origin-header

IE10以下不支持CORS

2.JSONP

html原生的带有src属性的标签,比如CSS IMG SCRIPT标签不存在跨域问题,jsonp正是利用script标签来实现跨域。 script标签引入一个js文件,这个js文件载入成功后会执行我们在url参数中指定的函数,并且会把我们需要的json数据作为参数传入。
JSONP只支持GET请求。

3. 同域代理

同域代理就是使用ajax先发送数据到中间代理,代理通过后端逻辑来向目标站发送请求。

posted @ 2019-12-10 15:07  小小leo  阅读(550)  评论(0编辑  收藏