javascript - VueJS 2 Cli 使用 Dev Server 将 POST 请求转换为 GET 请求

Question

问题

我使用 Vue CLI 启动了一个新的 VueJS 项目。我正在使用 fetch 将登录信息发布到远程 DEV 服务器。当我在我的本地环境中调用此方法时，它会将此调用处理为 GET，然后是 POST，然后是 OPTIONS，然后是 GET。

这是我运行 POST 请求后 Chrome 网络面板显示的内容。

当它到达 api 服务器时，它被作为 GET 请求处理，返回 405，因为它是 POST 而不是 GET。

问题

为什么它在两个 301 之间跳来跳去，然后将调用转换为 GET 请求。

---

工具

我正在使用 VueJS 2 CLI、Webpack 和 Babel

Note: I replaced the real api url and server with a fake one

JavaScript 获取方法

authenticate (username, password) {
  const url = '/api/login/authenticate/'
  return fetch(url, {
    method: 'POST',
    body: JSON.stringify({ username, password }),
    headers: new Headers({
      'Content-Type': 'application/json'
    })
  }).then(res => res.json());
}

Webpack API 代理设置

proxyTable: {
   "/api": "http://www.myDevServer.net"
}

Answer 1

当我更改 Webpack API 代理设置以匹配 this 时，它开始工作了图案。我还没有在 changeOrigin 上找到文档，但它似乎不言自明。

更正了 Webpack API 代理设置

proxyTable: {
   "/api": {
      target: "http://www.myDevServer.net",
      changeOrigin: true
   }
}

我猜发生的事情是我调用了一个改变了来源的代理。由于代理服务器不允许这样做，因此它返回了 301。由于服务器不在那里，它不允许 POST 请求。然后代理试图查看可用的选项，因此它发送了一个 OPTIONS 调用。它看到 GET 被允许并调用它。 GET 试图在我的 POST 调用下进行处理，但由于格式错误而失败，返回了 405