在一个使用 Vue CLI 构建的前端项目中，当开发者遇到跨域请求失败时，可以采取哪些配置手段或方案来规避或解决跨域限制？
考察说明
考查对前端开发中跨域问题的理解及在 Vue CLI 项目中的实际解决能力。
回答思路
- 【回答框架 1】跨域是浏览器同源策略限制，仅影响浏览器端，表现为请求发送成功但响应被拦截。Vue CLI 项目中常用 devServer.proxy 配置代理解决开发环境跨域，原理是让本地服务器转发请求，规避浏览器直连。
- 【回答框架 2】实现方式：在 vue.config.js 中设置 devServer.proxy，如将 /api 前缀的请求代理到目标服务器，并配置 pathRewrite 移除 or 保留前缀；该方案仅作用于开发环境，生产环境需由 Nginx 或后端网关处理。
- 【回答框架 3】生产环境可选方案：使用 Nginx 反向代理统一入口，将前端和后端部署在同域下；或后端开启 CORS（设置 Access-Control-Allow-Origin 等响应头）；也可采用 JSONP（仅限 GET）或 WebSocket 等不受同源策略限制的通信方式。
- 【回答框架 4】选择依据：开发阶段优先代理，生产优先 CORS 或网关代理，不推荐过度依赖 JSONP，因其不支持所有 HTTP 方法且存在安全限制。
- 【关键点 1】devServer.proxy 是 Vue CLI 开发环境的标准跨域解决方案。
- 【关键点 2】代理只作用于开发服务器，生产环境需单独配置。
- 【关键点 3】生产环境可用 Nginx 反向代理或后端开启 CORS。
- 【易错点 1】误以为代理配置适用于生产环境，导致部署后跨域仍存在。
- 【易错点 2】未处理 pathRewrite 导致请求路径不对，代理转发失败。
- 【易错点 3】跨域失败时盲目修改后端 CORS，忽略请求携带凭证（credentials）时需精确配置具体域名而非通配符。