跨域简介

一、 原因

1. 浏览器的同源策略,即浏览器的安全措施

2. 接口请求:

a. 登录后,服务端会下发Cookie,Cookie里带有当前网站的身份信息,下次请求会把Cookie带上

b. 如果没有同源策略,一个请求会把别的网站的Cookie带上,造成CSRF(Cross-Site request forgery)攻击,即跨域伪造请求攻击

3. DOM查询

可以拿到别的网站的DOM,即浏览器里的元素

二、跨域概念

1. 浏览器的同源策略:协议(http/https)、域名(www.123.com/456.cn, 三部分一个有不同就不是同一个域名)、端口(8001/8002)都相同

2. 有一个不同就是不同的域,之间的请求就是跨域操作

3. 特别的:localhost和127.0.0.1也是跨域

4. 跨域:浏览器不能执行其他网站的脚本,即不能执行非同源页面的脚本

三、跨域实现方式

1. JsonP,只支持get请求,不支持post请求

2. 代理,通过后台接口去调用,绕过了浏览器,比如Nginx代理

3. CROS

在Header里加上

Access-Control-Allow-Origin: *

Access-Control-Allow-Methods: POST, GET, OPTIONS

Access-Control-Allow-Headers: X-PINGOTHER, Content-Type

Access-Control-Max-Age: 86400

四、OPTIONS

1. 简单请求满足条件

a. 请求方法:GET,HEAD,POST的其中一种

b. HTTP头的请求字段:ACCEPT, ACCEPT-LANGUAGE,CONTENT-LANGUAGE,CONTENT-TYPE

c. CONTENT-TYPE的类型:application/x-www-form-urlencoded,multipart/form-data,text/plain

2. 常见的复杂请求:请求方法是PUT,DELETE, 或者content-type是 application/json

3. 预检OPTIONS请求,只有在跨域请求时,在发送复杂请求之前,会进行一次options请求,成为预检

参考:

https://segmentfault.com/a/1190000015597029?utm_source=tag-newest

原文地址:https://www.cnblogs.com/june0816/p/8393733.html