CODEWITHSUNDEEP
reactjsmongodbnext.js
Joshua Boddy
Joshua Boddy

Reputation: 113

TypeError: options.providers is not iterable in Next Auth

So I've been trying to integrate Next Auth to a full stack NextJS web app. I've handled logins with JWT and am storing sessions on the browser due to using a Credentials login type with Next Auth. I have managed to get the login to work, however I am now trying to protect my API route to retrieve the user's basic data from the MongoDB. The relevant files are below, however, I am running into an error with unstable_getServerSession() (at least according to the trace) that says that options.providers is not iterable. I cannot understand this as I have created it as an array...

Any help would be greatly appreciated!

[...nextauth].js

import NextAuth from 'next-auth';
import CredentialsProvider from 'next-auth/providers/credentials';
import clientPromise from '../../../lib/mongodb'
import { compare } from 'bcryptjs'

export default NextAuth({
    session: {
        strategy: "jwt"
    },
    providers: [
        CredentialsProvider({
            name: "Email and Password",
            credentials: {
                email: { label: "Email", type: "email", placeholder: "Email Address" },
                password: { label: "Password", type: "password", placeholder: "Password" }
            },
            async authorize(credentials, req) {
                const db = (await clientPromise).db();
                const employees = db.collection('employees');
                const res = await employees.findOne({
                    email: credentials.email
                });
                if (!res) {
                    throw new Error('No user found with those details');
                }
                const checkPassword = await compare(credentials.password, res.password);
                if (!checkPassword) {
                    throw new Error('Incorrect username or password');
                }
                return res;
            }
        }),
    ],
    pages: {
        signIn: "/signin"
    }
})

getEmployeeData.js

import { unstable_getServerSession } from "next-auth/next"
import authOptions from "../auth/[...nextauth]"
import clientPromise from "../../../lib/mongodb";

export default async function getEmployeeData(req, res) {
    const session = await unstable_getServerSession(req, res, authOptions);
    if (session) {
        res.status(200).json({ success: "You got it!" });
    }
}

Error Message

error - TypeError: options.providers is not iterable
    at assertConfig (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next-auth/core/lib/assert.js:68:34)
    at NextAuthHandler (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next-auth/core/index.js:70:52)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async unstable_getServerSession (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next-auth/next/index.js:79:19)
    at async getEmployeeData (webpack-internal:///(api)/./pages/api/employees/getEmployeeData.js:13:21)
    at async Object.apiResolver (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/api-utils/node.js:366:9)
    at async DevServer.runApi (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/next-server.js:481:9)
    at async Object.fn (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/next-server.js:735:37)
    at async Router.execute (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/router.js:247:36)
    at async DevServer.run (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/base-server.js:347:29) {
  page: '/api/employees/getEmployeeData'
}
error - TypeError: options.providers is not iterable
    at assertConfig (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next-auth/core/lib/assert.js:68:34)
    at NextAuthHandler (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next-auth/core/index.js:70:52)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async unstable_getServerSession (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next-auth/next/index.js:79:19)
    at async getEmployeeData (webpack-internal:///(api)/./pages/api/employees/getEmployeeData.js:13:21)
    at async Object.apiResolver (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/api-utils/node.js:366:9)
    at async DevServer.runApi (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/next-server.js:481:9)
    at async Object.fn (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/next-server.js:735:37)
    at async Router.execute (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/router.js:247:36)
    at async DevServer.run (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/base-server.js:347:29) {
  page: '/api/employees/getEmployeeData'
}
error - TypeError: options.providers is not iterable
    at assertConfig (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next-auth/core/lib/assert.js:68:34)
    at NextAuthHandler (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next-auth/core/index.js:70:52)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async unstable_getServerSession (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next-auth/next/index.js:79:19)
    at async getEmployeeData (webpack-internal:///(api)/./pages/api/employees/getEmployeeData.js:13:21)
    at async Object.apiResolver (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/api-utils/node.js:366:9)
    at async DevServer.runApi (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/next-server.js:481:9)
    at async Object.fn (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/next-server.js:735:37)
    at async Router.execute (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/router.js:247:36)
    at async DevServer.run (/Users/MYNAME/Programming/Work/Dan/HR-System/fullstack/node_modules/next/dist/server/base-server.js:347:29) {
  page: '/api/employees/getEmployeeData'

I know, same error repeated three times, don't know why that happens either...

Upvotes: 2

Views: 3589

Answers (1)

Jakob Basshunter Widmann
Jakob Basshunter Widmann

Reputation: 302

You have to separately export the authOptions and apply them to the export default NextAuth(authOptions) as an argument.

Here is the solution for your code:

export const authOptions = {
    session: {
        strategy: "jwt"
    },
    providers: [
        CredentialsProvider({
            name: "Email and Password",
            credentials: {
                email: { label: "Email", type: "email", placeholder: "Email Address" },
                password: { label: "Password", type: "password", placeholder: "Password" }
            },
            async authorize(credentials, req) {
                const db = (await clientPromise).db();
                const employees = db.collection('employees');
                const res = await employees.findOne({
                    email: credentials.email
                });
                if (!res) {
                    throw new Error('No user found with those details');
                }
                const checkPassword = await compare(credentials.password, res.password);
                if (!checkPassword) {
                    throw new Error('Incorrect username or password');
                }
                return res;
            }
        }),
    ],
    pages: {
        signIn: "/signin"
    }
}

export default NextAuth(authOptions)

Upvotes: 5

Related Questions