在现代 Web 开发中，跨域问题 是前端开发者经常面临的挑战之一。随着 Web 应用越来越复杂，前后端分离、微服务架构以及第三方 API 的广泛使用，跨域问题也愈发显得复杂和难解。所谓的“跨域”问题，指的是浏览器出于安全考虑，阻止来自一个源（domain、protocol、port）的网页请求另一个源的资源。
在这篇文章中，我们将深入探讨 JavaScript 中常见的跨域问题，以及解决这些问题的多种方法和技术，帮助你理解并突破这些跨域难题。
1. 什么是跨域？
跨域是指在浏览器中执行 JavaScript 代码时，尝试通过 XMLHttpRequest 或 Fetch API 向不同源（不同域名、协议或端口）发起请求。浏览器为了防止恶意网站访问用户数据，实施了 同源策略（Same-Origin Policy），即浏览器禁止从一个源加载的脚本访问另一个源的资源。
同源策略 定义为：
协议相同（例如：http:// 与 https:// 不同）
域名相同
端口号相同
如果任一条件不相同，则会被视为跨域请求。
2. 常见的跨域场景
跨域问题通常出现在以下几种常见场景中：
2.1. 通过 Ajax 或 Fetch 发起跨域请求
当我们通过 XMLHttpRequest 或 Fetch 向不同源发起请求时，浏览器会因为同源策略而阻止请求。
2.2.