【不止前端】前端跨域文件简介及场景
【不止前端】前端跨域文件简介及场景
余生一、什么是跨域？
首先声明一点，跨域是浏览器拦截的行为，请求已经发送到后端，后端返回的响应数据被浏览器拦截住了，这就是跨域的流程。
在前端领域中，跨域是指浏览器允许向服务器发送跨域请求，从而克服Ajax只能同源使用的限制。
什么是同源策略？
同源策略是一种约定，由Netscape公司1995年引入浏览器，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同，即便两个不同的域名指向同一个ip地址，也非同源。
同源策略限制以下几种行为：
- Cookie、LocalStorage 和 IndexDB 无法读取
- DOM和JS对象无法获得
- AJAX 请求不能发送
二、常见的跨域场景
| URL | 说明 | 是否允许通信 |
|---|---|---|
| http://www.domain.com/a.js http://www.domain.com/b.js | 同一域名，不同文件或路径 | 允许 |
| http://www.domain.com:8000/a.js http://www.domain.com/b.js | 同一域名，不同端口 | 不允许 |
| http://www.domain.com/a.js https://www.domain.com/b.js | 同一域名，不同协议 | 不允许 |
| http://www.domain.com/a.js http://192.168.4.12/b.js | 域名和域名对应相同ip | 不允许 |
| http://www.domain.com/a.js http://x.domain.com/b.js http://domain.com/c.js | 主域相同，子域不同 | 不允许 |
| http://www.domain1.com/a.js http://www.domain2.com/b.js | 不同域名 | 不允许 |
