首页 > 解决方案 > Next.Js 中如何处理 API 请求中的错误?

问题描述

我正在使用带有单独后端的 Next.Js 开发应用程序,当我尝试进行身份验证时,我在处理 Next 中的 API 返回的错误时遇到问题。我正在使用 Axios 发出请求。

当我发送不正确的凭据(用户名或密码)时,我的 API 会发送这样的响应

res.status(400).json({error: "Username or password is invalid!"})

但是,当我在前端 ( Next.Js ) 中收到错误响应并尝试显示在 sweetalert2 警报或中返回的此消息时console.log(),仅出现错误代码,我无法从返回的错误中捕获此消息

以下是我捕获的错误消息:

Error: Request failed with status code 400
    at createError (createError.js:16)
    at settle (settle.js:17)
    at XMLHttpRequest.handleLoad (xhr.js:62)

这里是我发出请求并处理它的函数的代码:

 async function signIn({ user, pass }: ILoginRequest) {

    try {
      const result = await api.post('/login', { user, password: pass });

      setUser({
        email: result.data.user_info.email,
        ra: result.data.user_info.ra,
        name_user: result.data.user_info.name_user,
      })

      setCookie(undefined, 'app-token', result.data.token, {
        expires: new Date(result.data.expiresIn)
      })

      Router.push('./home');
    } catch (err) {
      console.log(err)
      Swal.fire({
        title: 'Error!',
        text: err,
        icon: 'error',
        confirmButtonText: 'Aceitar'
      })
    }
  }

标签: node.jsreactjsaxiosnext.js

解决方案


推荐阅读