Question

我使用React和fetch API对用户身份验证后端发出POST请求。我可以使用Postman执行下面的POST请求，然后我得到了正确的JWT，但奇怪的是 - 每当我在React中使用以下代码时，POST请求就会以某种方式作为GET请求命中服务器。

React中的代码：

    return this.fetch('http://fakeURL.com/auth', {
        method: 'POST',
        headers: {
          Accept: 'application/json',
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({
          "email": "email@email.com",
          "password": "password",
        })
    }).then(res => {
        this.setToken(res.token);
        return Promise.resolve(res);
    })

日志显示（首先是飞行前请求）：

Request URL: http://fakeURL.com/auth
Request Method: OPTIONS
Status Code: 200 OK
Referrer Policy: no-referrer-when-downgrade

实际要求：

Request URL: http://fakeURL.com/auth
Request Method: GET
Status Code: 405 METHOD NOT ALLOWED
Referrer Policy: no-referrer-when-downgrade

我尝试的事情：

在本地和AWS S3存储桶中运行应用程序（CORS配置为允许所有方法，并且来自任何来源）
在我们的后端使用Flask启用CORS
通过Postman使用相同的API POST请求访问我们的后端（当我们使用Postman时，API请求按预期工作，作为返回令牌的POST）
点击其他网址（例如http://httpbin.org/post）以查看我的代码是否可以使用POST而不是GET命中这些端点...并且这些端点也会看到GET请求（而不是预期的POST）

这太令人困惑了 - 什么可能导致我们的POST请求作为GET请求出去？我觉得我们已经消除了在React中发生的奇怪事情之外的所有可能原因。谢谢你的帮助！

Answer 1

npm install --save axios

在您的身份验证页面上

：从'axios'中导入axios

修改你的帖子，而不是使用fetch：

login(emailValue, passwordValue) {
    return axios({
        url: `yourAuthURL`,
        method: 'POST',
        headers: {
          Accept: 'application/json',
          'Content-Type': 'application/json',
        },
        data: {
          "email": emailValue,
          "password": passwordValue,
        }
    }).then(res => {
        console.log(res);
    })
}

ReactJS似乎将POST请求转换为GET请求

1 个答案: