在Web开发中，当你从前端JavaScript调用一个与当前页面来源不同的API时，常常会在浏览器控制台看到一个令人困惑的错误：跨域错误。这背后是浏览器一个重要的安全基石——同源策略。

理解同源策略与跨域
同源策略规定：浏览器允许一个源（域名、协议、端口的组合）的脚本与来自同源的资源自由交互，而对不同源的资源访问则施加严格限制。

同源示例：https://www.example.com/page 与 https://www.example.com/api（协议、域名、端口均相同）。

跨域示例：http://example.com 与 https://example.com（协议不同）、www.example.com 与 api.example.com（子域名不同）、example.com:
80 与 example.com:8080（端口不同）。

跨域即指：从一个源的网页，去请求另一个源的资源。浏览器出于安全考虑，默认会阻止这类跨域HTTP请求（如图像、字体、XHR/fetch请求），以防恶意网站窃取用户在其他网站的数据。

为何需要解决跨域？
在现代前后端分离的开发模式下，前端应用（如运行在http://localhost:3000）需要频繁调用独立部署的后端API（如http:
//api.yourdomain.com），这天生就是跨域的。因此，必须通过安全且合规的方式解决跨域问题。

主流跨域解决方案
CORS（跨域资源共享）：目前最主流、最标准的方案。由后端服务器在HTTP响应头中添加如 Access-Control-Allow-Origin
等字段，明确告知浏览器允许哪些源进行跨域访问。

反向代理：在开发或部署时，使用Nginx、Node.js中间件等工具设置一个代理服务器。让前端请求同源的代理地址，由代理服务器转发请求到真实的API服务器，从而“绕过”浏览器的同源检查。

JSONP（仅限GET请求）：利用