跨域问题出现 =＞ 解决办法

什么是跨域问题呢？

跨域（Cross-Origin）指的是在 Web 开发中，一个网页的运行环境（域）与所请求资源的域不一致，即请求的目标资源与当前网页的域名（协议、域名或端口）不同。

同源策略

Web 浏览器遵循同源策略（Same-Origin Policy），这是一种安全策略，旨在防止潜在的恶意网站窃取用户数据或进行其他安全攻击。同源策略要求网页的运行环境和所请求的资源必须拥有相同的协议、域名和端口，否则浏览器会阻止跨域请求的执行。

举例来说，每个网站都有一个域名或者IP地址（实际上域名就是对IP地址的别名，方便人们记忆）。当我们访问一个网站时，浏览器会将某个页面下载到本地并解析，以展示图形页面。为了支持更多的业务需求，在这个页面中可能会发起一些额外的请求。为了避免页面卡顿，我们使用了Ajax技术偷偷地通过后门请求数据。偷偷走后门是可行的，但是必须遵循规则，不可以随意发起请求。

假设当前页面是www.baidu.com，在这个页面中发送了一个Ajax请求。浏览器允许请求发送出去，但是请求的地址不是本身的地址，而是www.hao123.com/api/xxxx这样的地址。此时，浏览器会检查响应，并查看服务端是否允许任何来源发起请求。如果服务端允许，浏览器将放行请求。否则，浏览器会报错，这种错误就是跨域问题。

如何处理跨域问题呢？

1.JSONP（JSON with Padding）

核心思想是浏览器只限制ajax，不限制图片、多媒体、css、js等资源访问其他网站，恰好利用这个特性，使用一些技巧来解决跨域。

JSONP 是一种通过添加一个<script>标签来进行跨域请求的方法。服务器返回的不是纯JSON数据，而是一个包含JSON数据的函数调用。这个函数会被前端代码定义，从而实现跨域数据的获取。JSONP只支持GET请求。

有局限性，需要回调函数 +别人服务端配合

2.CORS（Cross-Origin Resource Sharing）

CORS 是一种由服务器设置的响应头，允许特定的源在浏览器上进行跨域访问。服务器可以设置Access-Control-Allow-Origin响应头来指定允许的源，以及其他相关的CORS头，如Access-Control-Allow-Methods、Access-Control-Allow-Headers等。CORS支持各种HTTP方法。

有局限性，需要服务端配合，别人服务端安全性降低

3.代理服务器（Proxy）

前端可以通过在自己的服务器上设置代理，使其能够代替浏览器向目标服务器发起请求。前端代码向自己的服务器发送请求，然后服务器再将请求转发到目标服务器，并将响应返回给前端。这样可以避免跨域问题，因为浏览器实际上只与同源的服务器通信。

这个是比较好的解决方案

4.WebSocket

如果需要进行实时通信，WebSocket 提供了一种在浏览器中实现跨域通信的方法。WebSocket 协议允许在不受同源策略限制的情况下建立双向通信。

这些就是当在项目中遇到跨域问题时快速的解决办法。