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

Question

我正在创建一个 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("/");

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

标签： javascriptnode.jsreactjsexpressaxios

Answer 1

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

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

基本上，您可以将响应部分留空，然后在错误函数中抛出异常，以便您可以从进行调用的地方处理它。

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

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