Vue 与 Spring Boot 联调时，我曾把一个下午花在后端跨域配置上。后端已经配置 CORS，请求仍然失败，最后却发现前端地址直接写了 localhost，没有按预期写完整的 HTTP URL。补上协议后，请求恢复。

这个经历提醒我：先确认请求实际发到哪里，再判断是不是跨域。

用明确的地址表达请求目标

对独立后端，可以使用完整 URL：

axios.get('http://localhost:8080/api/items');

也可以创建带 baseURL 的实例：

const api = axios.create({
  baseURL: 'http://localhost:8080'
});

api.get('/api/items');

这是本地联调地址示例。生产应使用与站点部署相符的地址和协议。

相对地址如何解析，取决于 baseURL、当前页面以及代理配置。缺少协议的字符串不一定都以同一种方式失败；有的会被组合成意料之外的地址，有的会在解析阶段报错。Axios 请求配置

Network 面板里的 URL 才是依据

打开浏览器开发者工具，定位实际请求，依次查看：

  1. 完整 Request URL 是否指向目标后端。
  2. 请求方法、请求头和是否携带凭据。
  3. 是否发生重定向，最终地址是否改变。
  4. 状态码、响应正文，以及是否存在 OPTIONS 预检。

如果请求还没有到正确服务，修改目标服务的 CORS 配置自然可能没有作用。前端代理只对符合代理规则的请求生效，也不能假设所有 Axios 调用都会走代理。

分开处理几种失败

地址解析失败、DNS 或连接失败、HTTPS 页面请求不合适的 HTTP 资源，以及实际跨域拒绝，是不同问题。

确认确实是 CORS 后，再核对页面来源的协议、主机和端口，检查后端允许的来源与响应头。携带凭据时还要遵守相应限制，不应无条件允许任意来源。浏览器 CORS 说明

浏览器控制台的摘要往往不足以定位根因。把完整 URL、预检、响应和重定向串起来，才能知道该改前端地址、开发代理，还是后端的跨域策略。