第二种:可以对多套服务器环境进行代理配置

借助第三方库:http-proxy-middleware

项目安装:npm install --save-dev http-proxy-middleware

在src目录下新建setupProxy.js文件,在js文件里写入配置:

const { createProxyMiddleware } = require('http-proxy-middleware')

module.exports = function (app) {

app.use(

'/api', // 指定需要转发的请求

createProxyMiddleware({

target: ' http://localhost:3001',//服务器的地址

changeOrigin: true,

pathRewrite(path) {

return path.replace('/api', '');

在你业务接口的调用路径前面加上/api:

最后最重要的一点:api调用的服务器的地址(baseUrl)应是你当前的本地地址,比如我的本地地址是: http://localhost:3000,,我的服务器地址:http://localhost:3001,如果还是以服务器的地址作为baseUrl,那还是跨域失败,当然如果你上线时,自己要做好逻辑判断,用回服务器地址。

以上两个方案在设置后都需要进行服务重启才会生效。

分类:
前端