【问题标题】:Returning JSON within the same Fetch POST API call在同一个 Fetch POST API 调用中返回 JSON
【发布时间】:2017-10-01 20:15:14
【问题描述】:

我目前有一个基于 Node.js 的 Express 框架构建的网络应用程序。

我现在正在构建一个需要执行用户登录的 React Native 应用程序。为此,我创建了一个mongo-helpers.js 文件,该文件将简单地执行对 localhost:3000/api 的 api 调用并返回 JSON。到目前为止,我在拨打GET 和接收数据方面都没有问题,但是这是我的问题和我想要做的:

目标:当按下登录按钮时(在 React Native 应用程序中)对 localhost:3000/api/login 进行 API 调用,将 usernamepassword 传递到 @ fetch API POST 请求的 987654327@。如果用户已登录,则发回用户的 Mongo 文档。

问题:虽然我能够发出 API Post 请求并成功登录用户,但我无法通过 res.json(user) 发回用户的 Mongo 文档

这是我的代码:

Express WEB APP:routes/api/api.js

// POST and login user
router.post('/login', (req, res) => {
  user.findOne({name: req.body.name, password: req.body.password})
    .then((user) => {
      console.log(user);
      res.json(user)
    })
    .catch((error) => res.json(error))
});

React Native 应用程序:mongo-helpers.js

// Returns a promise
//  if login succeeds then return the user
//  if login fails return error
exports.login = (name, password) => {
  return new Promise(
    (resolve, reject) => {
      fetch(APP_SERVER_URL+'/login', {
        method: 'POST',
        headers: {
          'Accept': 'application/json',
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({name, password})
      }).then((response) => {
        console.log('Response', response);
      }).then((data) => {
        console.log(data); // returns undefined :(
        resolve(data);
      }).catch((error) => {
        console.log('Error', error); // no error is returned
        reject(error);
      })
    }
  )
};

我正在记录response,这就是它所显示的内容。里面没有用户数据

【问题讨论】:

  • 响应对象上没有.json()函数吗?
  • console.log(user); 在服务器/节点控制台上是否正确输出?
  • @Searching 是的

标签: javascript node.js mongodb react-native fetch-api


【解决方案1】:

你需要调用json函数,它会返回一个promise,试试这个:

fetch(APP_SERVER_URL+'/login', {
            method: 'POST',
            headers: {
              'Accept': 'application/json',
              'Content-Type': 'application/json'
            },
            body: JSON.stringify({name, password})
          }).then((response) => {
            response.json().then((data) => {
               console.log(data)
          });
          }).catch((error) => {
            console.log('Error', error); // no error is returned
            reject(error);
          })
        }

https://developer.mozilla.org/en-US/docs/Web/API/Body/json

【讨论】:

  • 是的,成功了!我打算发布答案,但你打败了我。感谢您的帮助!
【解决方案2】:

首先使用返回响应然后回调。

【讨论】:

  • 那仍然只会给他相同的响应对象
猜你喜欢
  • 2021-11-22
  • 2019-05-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-03-28
  • 2020-09-17
  • 2019-11-23
  • 2021-11-04
相关资源
最近更新 更多