Authjs Cognito Provider is Incompatible with Next.js Middleware Edge Runtime

[bestickley]

Goals

Document best practice for using the Cognito Provider with Next.js in Authjs V5.

Background

Next.js (artificially) constrains middleware to run in an edge runtime environment meaning Node.js APIs are not available. This is a problem for the Autjs Cognito Provider which transitively uses Node.js APIs (stream). When I use the Cognito Provider in Next.js middleware I received the following error:

Error: Cannot find module 'stream'
    at <unknown> (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/edge-wrapper_97f27b.js:525)
    at <unknown> (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/08b5e__pnpm_2d3ec6._.js:9826:15)
    at <unknown> (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/08b5e__pnpm_2d3ec6._.js:9829:3)
    at [project]/node_modules/.pnpm/@[email protected]/node_modules/@smithy/util-stream/dist-es/getAwsChunkedEncodingStream.js [middleware] (ecmascript) (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/08b5e__pnpm_2d3ec6._.js:9857:3)
    at <unknown> (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/edge-wrapper_97f27b.js:501:27)
    at runModuleExecutionHooks (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/edge-wrapper_97f27b.js:541:9)
    at instantiateModule (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/edge-wrapper_97f27b.js:500:9)
    at getOrInstantiateModuleFromParent (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/edge-wrapper_97f27b.js:573:12)
    at esmImport (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/edge-wrapper_97f27b.js:123:20)
    at <unknown> (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/08b5e__pnpm_2d3ec6._.js:9935:262)
    at [project]/node_modules/.pnpm/@[email protected]/node_modules/@smithy/util-stream/dist-es/index.js [middleware] (ecmascript) {module evaluation} (file:///Users/stickb/Code/dos/lighthouse/ui/.next/server/edge/chunks/08b5e__pnpm_2d3ec6._.js:9940:3) {
  middleware: true

I'm a little confused because I don't know where Authjs is making the call to the @smithy+util-stream library.

Proposal

In the discussion, Switchable Runtime for Middleware (Allow Node.js APIs in Middleware), it was proposed to

add async logic, like handling authentication, in the root layout which applies to all routes. This is similar to Middleware in some cases

I'm experimenting with this approach, and wanted to document my findings.

TBD

[bestickley]

🤦
I was importing an object into the middleware file that transitively imported an AWS SDK JS V3 library that used Node.js API. Issue resolved.