vue.config.js跨域配置

回答: 在Vue项目中，可以使用vue.config.js文件来配置跨域。根据提供的引用内容，有两个不同的配置示例。引用[1]中的配置示例使用了devServer.proxy来配置跨域，将以/api开头的请求代理到https://www.bgdjx.com:8080/plat/。引用[2]中的配置示例也使用了devServer.proxy来配置跨域，将以/api/FingerUnion/list.php开头的请求代理到http://iwenwiki.com。在这两个示例中，都需要设置ws和changeOrigin为true来允许跨域。此外，还可以使用pathRewrite来重写请求路径。在引用[3]中的代码示例中，通过axios发送了一个以/api/FingerUnion/list.php开头的请求，这个请求会被代理到后台接口。

相关问题

vue2 vue.config.js跨域

在Vue2中，可以通过在项目的根目录下创建vue.config.js文件来实现跨域。在该文件中，需要使用module.exports导出一个对象，其中包含devServer属性。在devServer属性中，可以通过配置proxy来实现跨域。具体步骤如下：

1. 在项目的根目录下创建vue.config.js文件。
2. 在vue.config.js文件中，使用module.exports导出一个对象。
3. 在导出的对象中，添加devServer属性，并配置其中的proxy属性。
4. 在proxy属性中，配置需要跨域的接口路径。
5. 在对应的接口路径中，设置target属性为目标服务器的地址。
6. 根据需要，可以设置其他属性，如ws、changeOrigin和pathRewrite等。

下面是一个示例的vue.config.js文件的代码：

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:3000',
        ws: true,
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  }
}

以上代码中，通过配置proxy属性，将以`/api`开头的请求代理到`http://localhost:3000`。这样，在Vue2项目中发起以`/api`开头的请求时，就会被代理到目标服务器。

请注意，以上代码仅为示例，实际使用时需要根据具体的接口和服务器进行配置。

vue.config.js 如何配置跨域

可以在 `vue.config.js` 中配置跨域的方法有两种：

1. 使用 `devServer.proxy` 选项。比如：

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://your.api.server.com',
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  }
}

这样，当请求的 URL 以 `/api` 开头时，请求会被代理到 `http://your.api.server.com`，并且带上跨域相关的 header。

2. 使用 `axios` 和 `CORS`（Cross-Origin Resource Sharing）。比如：

const axios = require('axios')

module.exports = {
  devServer: {
    before(app) {
      app.get('/api/*', (req, res) => {
        let url = 'http://your.api.server.com' + req.url.replace('/api', '')
        axios.get(url)
          .then(response => {
            res.json(response.data)
          })
          .catch(error => {
            res.json(error.response.data)
          })
      })
    }
  }
}

这样，所有以 `/api` 开头的请求都会被代理到 `http://your.api.server.com`，并且可以避免 CORS 问题。