Question

我正在学习前端和后端接口对接。但是我遇到了一个问题。

我的后端项目的端口为 8081 ，当我发送此请求http://localhost:8081/hello时，我将收到一个响应正文hello

我的前端项目的端口是 8080 。当我发送喜欢http://localhost:8080/hello的请求时，其响应与http://localhost:8081/hello

相同

这是我的vue.config.js

let proxyObj = {};

proxyObj['/']={
    ws: false,
    target: 'http://localhost:8081',
    changeOrigin: true,
    pathRewrite: {
        '^/': ''
    }
}

module.exports= {
    devServer: {
        host: 'localhost',
        port: 8080,
        proxy: proxyObj
    }
}

如果我将proxy: proxyObj更改为proxy: null，然后转到http://localhost:8080/hello，那么我什么也没收到。我的vue.config.js文件有问题吗？

任何帮助将不胜感激！

Answer 1

DevServer代理将根据您的代理配置来代理请求：

// '/'means this rule will match all requests
proxyObj['/']={
  ws: false,
  // target means requests that matched will be sent to http://localhost:8081
  target: 'http://localhost:8081',
  changeOrigin: true,
  pathRewrite: {
      '^/': ''
  }
}

使用此配置，您的所有请求都将发送到后端服务器，您将收到服务器的响应。如果将配置对象设置为null，则您的请求将发送到您的前端项目http://localhost:8080，因此您将不会收到任何响应。

有关代理配置的详细信息，请参见here。

为什么我的前端请求都全部发送到后端项目？

1 个答案: