Vite解决跨域的核心是代理而非CORS配置，即通过server.proxy将/api等前缀请求转发至后端，使浏览器仅与本地开发服务器通信，从而绕过同源策略；需在vite.config.ts中配置target、changeOrigin:true及rewrite路径，并确保前端请求使用相对路径如'/api/user'。
在 Vite 中解决跨域问题，核心不是“配置 CORS”，而是**绕过浏览器的 CORS 检查机制**——因为 CORS 是浏览器强加的安全限制，前端无法主动“开启”它，只能通过代理或配合后端响应头来应对。实际开发中，Vite 本身不处理 CORS 响应头，它只提供开发服务器代理能力，让请求变成“同源”，从而从源头规避问题。
用 Vite 代理代替 CORS（开发环境首选）
这是最常用、最安全、无需后端介入的方式。原理是：前端请求发给本地 Vite 开发服务器（如 http://localhost:5173/api/user），Vite 收到后自动转发给真实后端（如 http://localhost:8080/user），浏览器全程只和 localhost:5173 通信，自然不触发跨域。
- 在
vite.config.js或vite.config.ts的server.proxy中配置： -
/api是你约定的请求前缀，所有以它开头的请求都会被代理 -
target必须写完整协议+地址+端口（如http://localhost:8080） -
changeOrigin: true必须开启，否则某些后端（尤其 Spring Boot）会因 Origin 头不匹配而拒绝请求 -
rewrite用于去掉前缀，确保转发路径正确（例如/api/login→/login）
前端请求必须走相对路径
代理只对符合前缀的路径生效。如果你在代码里写了完整 URL，代理完全不起作用。
Alibabacloud Sdk Client Initialization For Java
下载
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
- ✅ 正确：
axios.get('/api/user')或fetch('/api/login') - ❌ 错误：
axios.get('http://localhost:8080/api/user')或fetch('https://api.example.com/user') - 建议统一管理基础路径：用
import.meta.env.VITE_API_BASE_URL，开发时设为/api，生产时设为真实域名
后端需配合的 CORS 配置（仅限需要 Cookie 或正式联调）
如果项目涉及登录态（如携带 cookie）、或要部署到测试环境直接访问后端，就必须由后端设置响应头。此时 Vite 代理不再适用，需后端明确放行前端来源。
立即学习“Java免费学习笔记（深入）”；
-
Access-Control-Allow-Origin不能填*当credentials: true（即带 cookie）时，必须指定具体源，如http://localhost:5173 -
Access-Control-Allow-Credentials: true才能让前端发送 cookie，后端也才能读取 session 或 token -
Access-Control-Allow-Methods和Access-Control-Allow-Headers建议按需开放，避免过度宽松 - Spring Boot 示例：在
CorsRegistry中配置allowedOrigins、allowCredentials(true)、allowedMethods
注意 localhost 和 127.0.0.1 的区别
浏览器把它们视为不同源。如果你前端用 http://127.0.0.1:5173 访问，而后端 CORS 只允许 http://localhost:5173，就会失败。
- 推荐统一用
localhost，并在vite.config.js中显式指定 host：host: 'localhost' - 或者后端 CORS 配置同时放行两个地址：
allowedOrigins("http://localhost:5173", "http://127.0.0.1:5173") - Chrome 的 SameSite 策略会影响 cookie 传递，若发现登录后状态丢失，优先检查是否因 Origin 不匹配导致 cookie 被拦截
