跨域学习总结

浏览器同源

概念

同源策略是一个重要的安全策略，它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档，减少可能被攻击的媒介。

定义

如果两个 URL 的 protocol、port (如果有指定的话)和 host 都相同的话，则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”。

同源判断

下表给出了与 URLhttp://mail.163.com/index.html 的源进行对比的示例:

URL	结果
http://mail.163.com/dir2/other.html	同源（只有路径不同）
http://mail.163.com/dir2/another.html	同源（只有路径不同）
https://mail.163.com/index.html	失败（协议不同）
http://mail.163.com:81/index.html	失败（端口不同 ， http:// 默认端口是80）
http://blog.163.com/index.html	失败（主机不同）

http://mail.163.com/index.html

1. http://:这个是协议，也就是HTTP超文本传输协议，也就是网页在网上传输的协议。
2. mail：这个是服务器名，代表着是一个邮箱服务器，所以是mail.
3. 163.com:这个是域名，是用来定位网站的独一无二的名字
4. mail.163.com：这个是主机名（网站名），由服务器名+域名组成
5. /：这个是根目录，也就是说，通过网站名找到服务器，然后在服务器存放网页的根目录
6. index.html：这个是根目录下的默认网页（当然，163的默认网页是不是这个我不知道，只是大部分的默认网页，都是index.html）

跨域

概念

不是同源的脚本不能操作其他源下面的对象。想要操作另一个源下的对象就需要跨域。 在同源策略的限制下，非同源的网站之间不能发送 AJAX （Asynchronous Java and XML的缩写）请求。
当浏览器发现发现的ajax请求是简单请求时，会在请求头中携带一个字段：Origin.

示例（预检请求）

浏览器会在真实请求发出前，增加一次OPTION请求，称为预检请求(preflight request)。预检请求将真实请求的信息，包括请求方法、自定义头字段、源信息添加到 HTTP 头信息字段中，询问服务器是否允许这样的操作

access-control-request-headers: api-version,content-type,current-city,token,x-token
access-control-request-method: GET
cache-control: no-cache
origin: https://platform-te.reach.cn
pragma: no-cache
referer: https://platform-te.reach.cn/
sec-fetch-dest: empty
sec-fetch-mode: cors
sec-fetch-site: same-site

Origin中会指出当前请求属于哪个域（协议+域名+端口）。服务会根据这个值决定是否允许其跨域。
与简单请求相比，除了Origin以外，多了两个头：

• Access-Control-Request-Method：接下来会用到的请求方式
• Access-Control-Request-Headers：自定义头字段头信息

服务器收到请求时，需要分别对 Origin、Access-Control-Request-Method、Access-Control-Request-Headers 进行验证，验证通过后，会在返回 HTTP 头信息中添加 ：

access-control-allow-credentials: true
access-control-allow-headers: api-version, content-type, current-city, token, x-token
access-control-allow-methods: OPTIONS,HEAD,GET,PUT,POST,DELETE,PATCH
access-control-allow-origin: https://platform-te.reach.cn
access-control-expose-headers: Origin, Accept, Content-Type, AccessToken

• Access-Control-Allow-Origin：可接受的域，是一个具体域名或者*，代表任意
• Access-Control-Allow-Credentials：是否允许用户发送、处理 cookie，默认情况下，cors不会携带cookie，true为允许携带
• Access-Control-Allow-Methods：真实请求允许访问的方式
• Access-Control-Allow-Headers：允许携带的头

如果浏览器得到上述响应，则认定为可以跨域。

SpringBoot配置Cors解决跨域问题

某一接口

@RequestMapping上添加@CrossOrigin

一系列接口

controller上添加@CrossOrigin

全局配置

CorsConfiguration

转载来源: 域名、主机名与URL.
转载来源: SpringBoot配置Cors解决跨域请求问题.
转载来源: Ajax原理.