前端学习小册

54 阅读1分钟

浏览器同源策略和跨域

什么是同源策略?

同源策略指的是浏览器出于安全性的考虑,对网页的规范化限制
怎样才叫同源?
http:协议、www.baodu.com域名、:8090端口号这三者完全相同才叫同源
例如:
http://www.baidu.com/https://www.baidu.com/这两者就不符合同源策略

什么是跨域?

发送请求时请求地址不符合浏览器的同源策略就叫跨域\

如何解决跨域?

  1. JSONP
    通过script标签中的src属性,我们可以避开浏览器的同源策略,直接向目标地址发送请求
  2. CORS
    CORS将请求分为两类,简单请求和预检请求
    一般情况下,只要设置了head,那就是一个预检请求
  • 简单请求:浏览器在发送请求时,会携带上Origin参数给后台,告知后台目前请求发送方的域名为什么,而后台则会回传Access-Contorl-Allow-Origin给前端,只要这两者保持一致,请求就校验通过
  • 预检请求:预检请求则会在发送真实请求前先发送询问,以OPTIONS请求的方式,携带上OriginAccess-Contorl-Request-MethodAccess-Contorl-Request-Headers这三个字段给后台,后台则返回相应的允许规则以及规则有效时间Access-Contorl-Max-Age给前端,通过了预检后,才会发送真实请求