vue3 跨域配置仍然无效？

问题：

用户按照文档配置了 .env 文件、api、config.ts，但是跨域请求仍然无法通过代理。配置如下：

• .env 文件：

  立即学习“前端免费学习笔记（深入）”；

  

  Element Plus UI Vue3

  Element Plus Vue3 桌面组件库。在开发 Vue 3.x 页面时调用，使用 Element Plus 组件（如 el-button、el-input、el-form、el-table 等）。

  下载

  vite_port=172
  vue_app_api_host=localhost

• api 使用：

  axios.get(`/interface/test`);

• config.ts：

  config.ts
  createProxy: {
  '/interface': {
    target: `http://${process.env.VUE_APP_API_HOST}:${process.env.VITE_PORT}`,
    changeOrigin: true,
    ws: true,
    secure: false
  }
  }

解答：

根据问题描述，配置中可能存在以下问题：

• 检查你的 createproxy 方法和 axios 是否配置了 baseurl。如果没有配置，则请求将直接发送到目标 url，而不会经过代理。
• 将第一个规则 /interface 修改为 /。这样做可以让所有请求都经过代理。

如果仍然无法通过代理，请检查：

• vite_port 环境变量是否与 baseurl 中的端口一致。如果端口不一致，则请求将直接发送到目标 url，而不会经过代理。