javascriptnext.jsnext-auth

Return error information from API when using Next-auth


Is it possible to allow next-auth to return errors from an API and pass them through from the client-side?

As an example, the API is returning specifically if the user's email or password is incorrect. On our mobile app, this is working great. Though on the website, we're using Next-auth. Using the credentials example from the documentation, it would be great to change the return value to an object.

import CredentialsProvider from "next-auth/providers/credentials"
providers: [
  CredentialsProvider({
    name: "Credentials",
 
    credentials: {
      username: { label: "Username", type: "text", placeholder: "jsmith" },
      password: {  label: "Password", type: "password" }
    },
    async authorize(credentials, req) {
      const user = { id: 1, name: "J Smith", email: "jsmith@example.com" }

      if (user) {
        // Any object returned will be saved in `user` property of the JWT
        return user
      } else {
        // Return an object that will pass error information through to the client-side.
        return { errors: user.errors, status: false }
      }
    }
  })
]

Please do let me know if there is another post that relates to this one as I'm unable to find it online.


Solution

  • Yes this should allow you to do that, though in the credential, when passing the values to the next auth, add a redirect:false

    You can find the documentation here

    Your sign in method will therefore look like this.

    signIn('credentials', { redirect: false, username:'username', password: 'password' })
    

    Your code can look like this

    import CredentialsProvider from "next-auth/providers/credentials"
    providers: [
      CredentialsProvider({
        name: "Credentials",
     
        credentials: {
          username: { label: "Username", type: "text", placeholder: "jsmith" },
          password: {  label: "Password", type: "password" }
        },
        async authorize(credentials, req) {
          const user = { id: 1, name: "J Smith", email: "jsmith@example.com" }
    
          if (user) {
            // Any object returned will be saved in `user` property of the JWT
            return user
          } else {
            // Return an object that will pass error information through to the client-side.
            throw new Error( JSON.stringify({ errors: user.errors, status: false }))
          }
        }
      })