reactjs: error al implementar las credenciales de NextAuth con inicio de sesión y backend personalizados

CorePress2024-01-25  8

Estoy implementando NextAuth con mi aplicación NextJS(GraphQL). Tengo este error:

Unhandled Runtime Error
TypeError: Cannot use 'in' operator to search for 'credentials' in null

El error de red también muestra:

Error: HTTP GET no es compatible con /api/auth/session

Error: HTTP GET no es compatible con /api/auth/providers

No estoy realizando una solicitud GET en ningún lugar que conozca. Mi código está a continuación:

páginas/api/[...nextauth.js]


const providers = [
  Providers.Credentials({
    name: 'Credentials',
    authorize: async (credentials) => {
      try {
        const user = await <GraphQL Logic to fetch user>

        if (user) {
          return {status: 'success', data: user.data.user}
        } 
      } catch (e) {
        const errorMessage = e.response.data.message
        // Redirecting to the login page with error messsage in the URL
        throw new Error(errorMessage + '&email=' + credentials.email)
      }

    }
  })
]

const callbacks = {
  async jwt(token, user) {
    if (user) {
      token.accessToken = user.data.token
    }

    return token
  },

  async session(session, token) {
    session.accessToken = token.accessToken
    return session
  }
}

const options = {
  providers,
  callbacks,
  pages: {
    error: '/login' // Changing the error redirect page to our custom login page
  }
}

export default (req, res) => NextAuth(req, res, options)

páginas/login.js

<form onSubmit={(e) => handleLogin(e)}>
            <input value={email} onChange={(e) => setEmail(e.target.value)} />
            <input type='password' value={password} onChange={(e) => setPassword(e.target.value)} />
            <button type='submit' disabled={isLoginStarted}>Log In</button>
          </form>

método handleLogin

const handleLogin = (e) => {
    e.preventDefault()
    setIsLoginStarted(true)
    signIn('credentials',
      {
        email,
        password,
        callbackUrl: `${window.location.origin}/welcome`
      }
    )
  }

¿Pudiste solucionar el problema?

-Desarrollar_SP

26 de mayo de 2021 a las 12:44

Tengo el mismo problema.

-Desarrollar_SP

26 de mayo de 2021 a las 12:45



------------------------------------

Por qué la URL se ve así

pages/api/[...nextauth.js]

debe ser

pages/api/[...nextauth].js

o si estás usando next.js 13.4, entonces

pages/api/[...nextauth]/route.js

Su guía para un futuro mejor - libreflare
Su guía para un futuro mejor - libreflare