feat(web): expose Web API compatible version of next-auth

.gitignore

@@ -34,6 +34,7 @@ packages/next-auth/utils
 packages/next-auth/core
 packages/next-auth/jwt
 packages/next-auth/react
+packages/next-auth/web
 packages/next-auth/adapters.d.ts
 packages/next-auth/adapters.js
 packages/next-auth/index.d.ts

apps/dev/pages/api/auth/[...nextauth].ts

@@ -1,5 +1,4 @@
-import NextAuth from "next-auth"
-import type { NextAuthOptions } from "next-auth"
+import NextAuth, { type NextAuthOptions } from "next-auth"
 
 // Providers
 import Apple from "next-auth/providers/apple"

packages/next-auth/package.json

@@ -32,14 +32,15 @@
     "./react": "./react/index.js",
     "./core": "./core/index.js",
     "./next": "./next/index.js",
+    "./web": "./web/index.js",
     "./middleware": "./middleware.js",
     "./client/_utils": "./client/_utils.js",
     "./providers/*": "./providers/*.js"
   },
   "scripts": {
     "build": "pnpm clean && pnpm build:js && pnpm build:css",
     "build:js": "pnpm clean && pnpm generate-providers && pnpm tsc --project tsconfig.json && babel --config-file ./config/babel.config.js src --out-dir . --extensions \".tsx,.ts,.js,.jsx\"",
-    "clean": "rm -rf coverage client css utils providers core jwt react next index.d.ts index.js adapters.d.ts middleware.d.ts middleware.js",
+    "clean": "rm -rf coverage client css utils providers core jwt react next web index.d.ts index.js adapters.d.ts middleware.d.ts middleware.js",
     "build:css": "postcss --config config/postcss.config.js src/**/*.css --base src --dir . && node config/wrap-css.js",
     "dev": "pnpm clean && pnpm generate-providers && concurrently \"pnpm watch:css\" \"pnpm watch:ts\"",
     "watch:ts": "pnpm tsc --project tsconfig.dev.json",
@@ -63,7 +64,8 @@
     "adapters.d.ts",
     "middleware.d.ts",
     "middleware.js",
-    "utils"
+    "utils",
+    "web"
   ],
   "license": "ISC",
   "dependencies": {
@@ -78,12 +80,16 @@
     "uuid": "^8.3.2"
   },
   "peerDependencies": {
+    "@panva/oauth4webapi": "1.2.0",
     "next": "^12.2.5",
     "nodemailer": "^6.6.5",
     "react": "^17.0.2 || ^18",
     "react-dom": "^17.0.2 || ^18"
   },
   "peerDependenciesMeta": {
+    "@panva/oauth4webapi": {
+      "optional": true
+    },
     "nodemailer": {
       "optional": true
     }
@@ -98,6 +104,7 @@
     "@babel/preset-typescript": "^7.17.12",
     "@edge-runtime/jest-environment": "1.1.0-beta.35",
     "@next-auth/tsconfig": "workspace:*",
+    "@panva/oauth4webapi": "1.2.0",
     "@swc/core": "^1.2.198",
     "@swc/jest": "^0.2.21",
     "@testing-library/dom": "^8.13.0",

packages/next-auth/src/client/_utils.ts

@@ -1,7 +1,7 @@
 import type { IncomingMessage } from "http"
 import type { LoggerInstance, Session } from ".."
 
-export interface NextAuthClientConfig {
+export interface AuthClientConfig {
   baseUrl: string
   basePath: string
   baseUrlServer: string
@@ -31,7 +31,7 @@ export interface CtxOrReq {
  */
 export async function fetchData<T = any>(
   path: string,
-  __NEXTAUTH: NextAuthClientConfig,
+  __NEXTAUTH: AuthClientConfig,
   logger: LoggerInstance,
   { ctx, req = ctx?.req }: CtxOrReq = {}
 ): Promise<T | null> {
@@ -50,7 +50,7 @@ export async function fetchData<T = any>(
   }
 }
 
-export function apiBaseUrl(__NEXTAUTH: NextAuthClientConfig) {
+export function apiBaseUrl(__NEXTAUTH: AuthClientConfig) {
   if (typeof window === "undefined") {
     // Return absolute path when called server side
     return `${__NEXTAUTH.baseUrlServer}${__NEXTAUTH.basePathServer}`

packages/next-auth/src/core/errors.ts

@@ -68,10 +68,15 @@ export class UnsupportedStrategy extends UnknownError {
 }
 
 export class InvalidCallbackUrl extends UnknownError {
-  name = "InvalidCallbackUrl"
+  name = "InvalidCallbackUrlError"
   code = "INVALID_CALLBACK_URL_ERROR"
 }
 
+export class InvalidEndpoints extends UnknownError {
+  name = "InvalidEndpoints"
+  code = "INVALID_ENDPOINTS_ERROR"
+}
+
 type Method = (...args: any[]) => Promise<any>
 
 export function upperSnake(s: string) {

packages/next-auth/src/core/index.ts

@@ -1,15 +1,14 @@
 import logger, { setLogger } from "../utils/logger"
-import { detectHost } from "../utils/detect-host"
+import { toInternalRequest, toResponse } from "./lib/web"
 import * as routes from "./routes"
 import renderPage from "./pages"
 import { init } from "./init"
 import { assertConfig } from "./lib/assert"
 import { SessionStore } from "./lib/cookie"
 
-import type { NextAuthAction, NextAuthOptions } from "./types"
+import type { AuthAction, AuthOptions } from "./types"
 import type { Cookie } from "./lib/cookie"
 import type { ErrorType } from "./pages/error"
-import { parse as parseCookie } from "cookie"
 
 export interface RequestInternal {
   /** @default "http://localhost:3000" */
@@ -19,73 +18,35 @@ export interface RequestInternal {
   headers?: Record<string, any>
   query?: Record<string, any>
   body?: Record<string, any>
-  action: NextAuthAction
+  action: AuthAction
   providerId?: string
   error?: string
 }
 
-export interface NextAuthHeader {
+interface AuthHeader {
   key: string
   value: string
 }
 
-export interface OutgoingResponse<
+export interface ResponseInternal<
   Body extends string | Record<string, any> | any[] = any
 > {
   status?: number
-  headers?: NextAuthHeader[]
+  headers?: AuthHeader[]
   body?: Body
-  redirect?: string
+  redirect?: URL | string // TODO: refactor to only allow URL
   cookies?: Cookie[]
 }
 
-export interface NextAuthHandlerParams {
-  req: Request | RequestInternal
-  options: NextAuthOptions
-}
-
-async function getBody(req: Request): Promise<Record<string, any> | undefined> {
-  try {
-    return await req.json()
-  } catch {}
-}
-
-// TODO:
-async function toInternalRequest(
-  req: RequestInternal | Request
-): Promise<RequestInternal> {
-  if (req instanceof Request) {
-    const url = new URL(req.url)
-    // TODO: handle custom paths?
-    const nextauth = url.pathname.split("/").slice(3)
-    const headers = Object.fromEntries(req.headers.entries())
-    const query: Record<string, any> = Object.fromEntries(
-      url.searchParams.entries()
-    )
-    query.nextauth = nextauth
-
-    return {
-      action: nextauth[0] as NextAuthAction,
-      method: req.method,
-      headers,
-      body: await getBody(req),
-      cookies: parseCookie(req.headers.get("cookie") ?? ""),
-      providerId: nextauth[1],
-      error: url.searchParams.get("error") ?? nextauth[1],
-      host: detectHost(headers["x-forwarded-host"] ?? headers.host),
-      query,
-    }
-  }
-  return req
-}
-
-export async function NextAuthHandler<
+async function AuthHandlerInternal<
   Body extends string | Record<string, any> | any[]
->(params: NextAuthHandlerParams): Promise<OutgoingResponse<Body>> {
-  const { options: userOptions, req: incomingRequest } = params
-
-  const req = await toInternalRequest(incomingRequest)
-
+>(params: {
+  req: RequestInternal
+  options: AuthOptions
+  /** REVIEW: Is this the best way to skip parsing the body in Node.js? */
+  parsedBody?: any
+}): Promise<ResponseInternal<Body>> {
+  const { options: userOptions, req } = params
   setLogger(userOptions.logger, userOptions.debug)
 
   const assertionResult = assertConfig({ options: userOptions, req })
@@ -105,6 +66,10 @@ export async function NextAuthHandler<
         body: { message } as any,
       }
     }
+
+    // We can throw in development to surface the issue in the browser too.
+    if (process.env.NODE_ENV === "development") throw assertionResult
+
     const { pages, theme } = userOptions
 
     const authOnErrorPage =
@@ -156,6 +121,7 @@ export async function NextAuthHandler<
       case "session": {
         const session = await routes.session({ options, sessionStore })
         if (session.cookies) cookies.push(...session.cookies)
+        // eslint-disable-next-line @typescript-eslint/no-unnecessary-type-assertion
         return { ...session, cookies } as any
       }
       case "csrf":
@@ -296,3 +262,17 @@ export async function NextAuthHandler<
     body: `Error: This action with HTTP ${method} is not supported by NextAuth.js` as any,
   }
 }
+
+/**
+ * The core functionality of `next-auth`.
+ * It receives a standard [`Request`](https://developer.mozilla.org/en-US/docs/Web/API/Request)
+ * and returns a standard [`Response`](https://developer.mozilla.org/en-US/docs/Web/API/Response).
+ */
+export async function AuthHandler(
+  request: Request,
+  options: AuthOptions
+): Promise<Response> {
+  const req = await toInternalRequest(request)
+  const internalResponse = await AuthHandlerInternal({ req, options })
+  return toResponse(internalResponse)
+}

packages/next-auth/src/core/init.ts

@@ -1,10 +1,9 @@
-import { randomBytes, randomUUID } from "crypto"
-import { NextAuthOptions } from ".."
+import { createHash, randomUUID } from "./lib/web"
+import { AuthOptions } from ".."
 import logger from "../utils/logger"
 import parseUrl from "../utils/parse-url"
 import { adapterErrorHandler, eventsErrorHandler } from "./errors"
 import parseProviders from "./lib/providers"
-import { createSecret } from "./lib/utils"
 import * as cookie from "./lib/cookie"
 import * as jwt from "../jwt"
 import { defaultCallbacks } from "./lib/default-callbacks"
@@ -16,7 +15,7 @@ import type { InternalOptions } from "./types"
 
 interface InitParams {
   host?: string
-  userOptions: NextAuthOptions
+  userOptions: AuthOptions
   providerId?: string
   action: InternalOptions["action"]
   /** Callback URL value extracted from the incoming request. */
@@ -44,7 +43,17 @@ export async function init({
 }> {
   const url = parseUrl(host)
 
-  const secret = createSecret({ userOptions, url })
+  /**
+   * Secret used to salt cookies and tokens (e.g. for CSRF protection).
+   * If no secret option is specified then it creates one on the fly
+   * based on options passed here. If options contains unique data, such as
+   * OAuth provider secrets and database credentials it should be sufficent.
+   * If no secret provided in production, we throw an error.
+   */
+  const secret =
+    userOptions.secret ??
+    // TODO: Remove this, always ask the user for a secret, even in dev! (Fix assert.ts too)
+    (await createHash(JSON.stringify({ ...url, ...userOptions })))
 
   const { providers, provider } = parseProviders({
     providers: userOptions.providers,
@@ -88,10 +97,7 @@ export async function init({
       strategy: userOptions.adapter ? "database" : "jwt",
       maxAge,
       updateAge: 24 * 60 * 60,
-      generateSessionToken: () => {
-        // Use `randomUUID` if available. (Node 15.6+)
-        return randomUUID?.() ?? randomBytes(32).toString("hex")
-      },
+      generateSessionToken: randomUUID,
       ...userOptions.session,
     },
     // JWT options
@@ -119,7 +125,7 @@ export async function init({
     csrfToken,
     cookie: csrfCookie,
     csrfTokenVerified,
-  } = createCSRFToken({
+  } = await createCSRFToken({
     options,
     cookieValue: reqCookies?.[options.cookies.csrfToken.name],
     isPost,

packages/next-auth/src/core/lib/assert.ts

@@ -1,25 +1,30 @@
 import {
   MissingAdapter,
+  MissingAdapterMethods,
   MissingAPIRoute,
   MissingAuthorize,
   MissingSecret,
-  UnsupportedStrategy,
   InvalidCallbackUrl,
-  MissingAdapterMethods,
+  InvalidEndpoints,
+  UnsupportedStrategy,
 } from "../errors"
 import parseUrl from "../../utils/parse-url"
 import { defaultCookies } from "./cookie"
 
 import type { RequestInternal } from ".."
 import type { WarningCode } from "../../utils/logger"
-import type { NextAuthOptions } from "../types"
+import type { AuthOptions } from "../types"
 
 type ConfigError =
+  | MissingAdapter
+  | MissingAdapterMethods
   | MissingAPIRoute
+  | MissingAuthorize
   | MissingSecret
+  | InvalidCallbackUrl
+  | UnsupportedStrategy
+  | InvalidEndpoints
   | UnsupportedStrategy
-  | MissingAuthorize
-  | MissingAdapter
 
 let warned = false
 
@@ -40,7 +45,7 @@ function isValidHttpUrl(url: string, baseUrl: string) {
  * REVIEW: Make some of these and corresponding docs less Next.js specific?
  */
 export function assertConfig(params: {
-  options: NextAuthOptions
+  options: AuthOptions
   req: RequestInternal
 }): ConfigError | WarningCode[] {
   const { options, req } = params
@@ -94,6 +99,20 @@ export function assertConfig(params: {
   let hasTwitterOAuth2
 
   for (const provider of options.providers) {
+    if (provider.type === "oauth" && !provider.issuer) {
+      const { authorization: a, token: t, userinfo: u } = provider
+      let key
+      if (typeof a !== "string" && !a?.url) key = "authorization"
+      else if (typeof t !== "string" && !t?.url) key = "token"
+      else if (typeof u !== "string" && !u?.url) key = "userinfo"
+
+      if (key) {
+        return new InvalidEndpoints(
+          `Provider "${provider.id}" is missing both \`issuer\` and \`${key}\` endpoint config. At least one of them is required.`
+        )
+      }
+    }
+
     if (provider.type === "credentials") hasCredentials = true
     else if (provider.type === "email") hasEmail = true
     else if (provider.id === "twitter" && provider.version === "2.0")