Next-auth: ExpressJS Server Example

[bryan]

Please refer to the documentation, the example project and existing issues before creating a new issue.

Your question
Before v2.0, an Express.js was used with next-auth. Now the documentation recommend using dynamic routing through next pages (default of /api/auth/[...nextauth].js), but if I wanted to keep using express.js would it be possible with v3.0+?

What are you trying to do
Trying to run an express.js server to handle the routing without using next.js dynamic folder routing through brackets [...nextauth].js. I couldn't find any documentation regarding this topic. An example repository demonstrating express.js would be great.

Documentation feedback
Documentation refers to searching through online documentation, code comments and issue history. The example project refers to next-auth-example.

Also receiving an error message on the express server:

[next-auth][warn][nextauth_url] NEXTAUTH_URL environment variable not set 
https://next-auth.js.org/warning#nextauth_url

The link is a deadend.

• [x] Found the documentation helpful
• [ ] Found documentation but was incomplete
• [x] Could not find relevant documentation
• [ ] Found the example project helpful
• [x] Did not find the example project helpful

[iaincollins]

It is possible, but don't have an example - but #554 might be helpful!

[iaincollins]

This example might be helpful too:
https://github.com/vercel/next.js/tree/canary/examples/custom-server-express

If you fall back to passing routing to the Next.js handler it should handle the API routes for you. You can use the NPM module dotenv module in your custom server to load .env files (Next.js normally does this automatically).

[bryan]

Thanks iain for #554, looks like a good start. Let me play around with my existing project some more and I'll reopen if I run into any issues.

[bryan]

@iaincollins, just wanted to clarify with you again that it is possible to get the routing done in the server without the need of pages/[...nextauth.js] on the client correct?

Currently running into this error, not quite sure where to start looking:

(node:10216) UnhandledPromiseRejectionWarning: TypeError: Cannot destructure property `nextauth` of 'undefined' or 'null'.
    at C:\Users\Bryan\project\server\node_modules\next-auth\dist\server\index.js:66:13
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (C:\Users\Bryan\project\server\node_modules\next-auth\dist\server\index.js:48:103)
    at _next (C:\Users\Bryan\project\server\node_modules\next-auth\dist\server\index.js:50:194)
    at C:\Users\Bryan\project\server\node_modules\next-auth\dist\server\index.js:50:364
    at new Promise (<anonymous>)
    at C:\Users\Bryan\project\server\node_modules\next-auth\dist\server\index.js:50:97
    at C:\Users\Bryan\project\server\node_modules\next-auth\dist\server\index.js:342:22
    at new Promise (<anonymous>)
    at C:\Users\Bryan\project\server\node_modules\next-auth\dist\server\index.js:58:12
(node:10216) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:10216) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

[RichardSPrins]

Has anyone made any progress with this? looking to use NextAuth with a custom server as well and this could help

[bryan]

Has anyone made any progress with this? looking to use NextAuth with a custom server as well and this could help

Unsure if the owner removed the ability to configure it using a custom server when migrating over from v2.0 to v3.0 without looking deep into the code, but where I'd start to play around is trying to configure it like v1.0 using the example here and see how far that gets you. This is my tentative action plan unless @iaincollins is able to give a definitive answer.

[bryan]

After playing around, it doesn't look like this is achievable on a separate server without populating the pages/[...nextauth.js] dynamic routing which is unfortunate since I was hoping the ability to set next-auth on the express server-side (similar to v1.0) was possible.

Will leave this issue open until I'm able to get a response or confirmation.

[varunsub]

Was anyone able to figure it out? I'm trying to use NextAuth.js with my custom express server.

[RichardSPrins]

According to Vercel, they are moving away from custom servers infavor of
their api routes, they recommend against it altogether, so making it work
would become very hacky.

On Wed, Oct 21, 2020, 7:50 PM varunsub [e-mail] wrote:

Was anyone able to figure it out? I'm trying to use NextAuth.js with my
custom express server.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/nextauthjs/next-auth/issues/531#issuecomment-714187026,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AK7NYQ35OHEO4AHFD2JWOODSL6MVTANCNFSM4PS2YVXQ
.

[zenflow]

I was able to use next-auth as part of my express server.
There are just 2 key things:

1. You need some middlewares for body & cookie parsing:

const express = require("express");
const cookieParser = require("cookie-parser");

const app = express();
app.use(express.json());
app.use(express.urlencoded({ extended: true }));
app.use(cookieParser());

1. You need to define req.query.nextauth (the catch-all route parameter) before calling NextAuth(req, res, options):

const NextAuth = require("next-auth").default;
const nextAuthOptions = require('./next-auth-options');

const baseUrl = "/api/auth/";

app.use((req, res, next) => {
  if (!req.url.startsWith(baseUrl)) {
    return next();
  }
  // Fill in the "nextauth" [catch all route parameter](https://nextjs.org/docs/routing/dynamic-routes#catch-all-routes)
  req.query.nextauth = req.url // start with request url
    .slice(baseUrl.length) // make relative to baseUrl
    .replace(/\?.*/, "") // remove query part, use only path part
    .split("/"); // as array of strings
  NextAuth(req, res, nextAuthOptions);
});

hint: For a working example, combine the code from 1 & 2 and fill in the blanks (options, app.listen(), install dependencies)

[bryan]

Closing as there is a working example in the thread.

[zenflow]

@bryan I think there's still some action that could be taken on this issue though.

@iaincollins
Would you be willing to accept a PR to add the example to the documentation? (a cleaned up version of course)
This would also make it clear (for people reading the docs) that this use case is supported, the handler doesn't need to be used in Next.js api routes, and it can be alternatively be used in a Connect/Express/Fastify/etc app.
Better yet, would you be willing to accept a PR to add a middleware factory to this library?
This would just make our code a little less noisy when using the library that way.