vue解决跨域

作者：屰兲洏垳＆发布日期:2025-09-19 浏览:80

// 在 Vue 项目中解决跨域问题，通常可以通过配置代理来实现。以下是一个在 `vue.config.js` 文件中配置代理的示例代码。

// vue.config.js

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://example.com', // 目标服务器地址
        changeOrigin: true,           // 是否改变源
        pathRewrite: {
          '^/api': ''                 // 重写路径，将 /api 前缀替换为空字符串
        }
      }
    }
  }
};

// 解释说明：
// 1. `target`: 指定目标服务器的地址，例如 `http://example.com`。
// 2. `changeOrigin`: 设置为 `true` 时，会修改请求头中的 host 为目标服务器的 host，避免某些服务器对请求头的校验导致跨域失败。
// 3. `pathRewrite`: 用于重写请求路径，例如将 `/api/users` 请求重写为 `/users` 发送到目标服务器。

上一篇：vue socket

下一篇：vue router push 传参