由于浏览器同源策略限制，一个源在访问另一个源的资源时会出现跨域问题，能有效防止恶意网站在浏览器中运行js脚本，从第三方读取数据，并将这些数据转发给攻击者。
源的定义
如果两个URL的协议、端口、主机都相同的话，这两个URL就是同源的。
下表给出了与 URL http://store.company.com/dir/page.html 的源进行对比的示例：
| URL | 结果 | 原因 |
|---|---|---|
| http://store.company.com/dir2/other.html | 同源 | 协议、端口、主机都相同 |
| https://store.company.com/secure.html | 不同源 | 协议不同 |
| http://store.company.com:81/dir/etc.html | 不同源 | 端口不同 |
| http://news.company.com/dir/other.html | 不同源 | 主机不同 |
解决跨域问题
- CORS: 在服务器端设置几个响应头，如
Access-Control-Allow-Origin: * - 反向代理: 在nginx/traefik/haproxy等代理服务器设置
- JSONP
- iframe：可以使用iframe加载另一个源的网站
- WebSocket：WebSocket没有跨域限制，需要后端自行判断请求的来源