如何在 reactjs 中向 nodejs RESTful API 发出 POST 请求答案

【问题标题】：How to make a POST request to a nodejs RESTful API in reactjs如何在 reactjs 中向 nodejs RESTful API 发出 POST 请求
【发布时间】：2019-02-22 02:13:42
【问题描述】：

我用nodejs 和express 构建了我的后端restful API，我也有一个基于Reactjs 的前端，我正在尝试制作一个登录页面。我的想法是在Reactjs 中向我的Nodejs RESTful API 发出POST 请求，包括用户名和密码，然后后端将检查请求信息是否正确将返回令牌，否则将返回失败消息。但我不知道在reactjs 中发出POST 请求的正确方法是什么。我只使用$.ajax() 吗？我试图避免使用jquery，因为我认为有很多方法可以做同样的事情。提前致谢。

【问题讨论】：

尝试使用axios或fetch

标签： javascript node.js ajax reactjs api

【解决方案1】：

如果您不想使用第三方库，可以使用fetch。

查看here 一篇关于如何在反应中使用 fetch 的好文章。

【讨论】：

谢谢，这绝对让我很开心。

【解决方案2】：

使用axios。无需使用jquery。

axios.post("http://api/login", { options }).then(res => ...).catch(err => ...)

选项将是：{ username: username, password: password ...etc }

我喜欢fetch 的地方在于，您可以定义一个baseurl（而不是为每个AJAX 请求一遍又一遍地编写http://localhost:5000/api/...）并且axios 会自动处理JSON。

【讨论】：

不应该是 axios.post("APIURL", {username: username, password: password}).then(res => ...).catch(err => . ..) ??第二个论点
更新了评论。 :)

【解决方案3】：

您应该将 axios.js 与 saga.js 框架一起使用。

// Send a POST request
axios({
  method: 'post',
  url: '/user/12345',
  data: {
    firstName: 'Fred',
    lastName: 'Flintstone'
  }
});

【讨论】：

【解决方案4】：

只需实现这个

function submitRequest(opts) {
      console.log('Posting request to your API...');
      fetch('http://your_url', {
        method: 'post',
        body: JSON.stringify(opts)
      }).then(function(response) {
        return response.json();
      }).then(function(data) {
       console.log(':', data);
      });
    }

【讨论】：