在反应中使用发布请求时如何从node.js获取数据答案

【问题标题】：How to get data from node.js when using a post request in react在反应中使用发布请求时如何从node.js获取数据
【发布时间】：2021-10-22 22:24:03
【问题描述】：

我正在创建一个 mern 身份验证项目，但遇到了一个问题。当信息发送到我的注册页面时，会在前端调用添加用户函数

async function addUser(user) {
    const config = {
      headers: {
        "Content-Type": "application/json",
      },
    };
    try {
      await axios.post("/users/register", user, config);
    } catch (err) {}
  }

在我的后端调用这个函数

exports.addUser = async (req, res, next) => {
  try {
    const { name, email, password } = req.body;
    let errors = [];
    // Check required fields
    if (!name || !email || !password) {
      errors.push("All Fields Need To Be Filled");
    }
    //Check Password Length
    if (password.length < 6) {
      errors.push("Password Needs To Be At Least 6 Characters Long");
    }
    if (errors.length > 0) {
      return res.status(201).json({
        success: false,
        errors,
      });
    } else {
      return res.status(201).json({
        success: true,
        data: req.body,
      });
    }
  } catch (error) {
    return res.status(500).json({
      success: false,
      error,
    });
  }
};

还有我的路线

router.route("/register").post(addUser)

我的问题是如何从 react.js 中的 node.js 函数中获取 json。例如，如果有错误我如何得到这个

      return res.status(201).json({
        success: false,
        errors,

在我的前端。由于这不是获取请求，因此我无法访问错误

      const res = await axios.get("/");

如果有人知道该怎么做，如果你提供帮助，那将意味着很多

【问题讨论】：

标签： javascript node.js reactjs express axios

【解决方案1】：

首先，我建议更改代码，因为201 的响应被视为成功的“已创建”响应 (mozilla docs)。

然后，如果您使用的是 axios，则需要在前端创建一个拦截器来处理响应错误。查看文档here。

基本上你可以将响应部分留空，然后在错误函数中抛出一个异常，这样你就可以从你发出调用的地方处理它。

axios.interceptors.response.use(
    (response) => response,
    (error) => {
        // you can handle the error here or throw an error
        throw error;
    }
})

我建议您将拦截器和基本 axios 调用放在单独的文件中，以便您更轻松地处理调用和拦截器。

【讨论】：