Payload Auth0 Plugin

This Package is still in development and will likely change.

Features

• ✅ Compatible with Payload v3
• 🔐 Configures Auth0 login with payload CMS

Wishlist/Roadmap

• ~~Add meta-data support and syncing~~
• Able to change the collection auth settings.
• ~~Ability to customize login button.~~
• Auto login functionality.
• Reduce the size of the package if possible.
• Increase the testing coverage.
• ... any other fixes

Installation

This package uses the NextJs Auth0 plugin currently a beta version and adds the Payload Auth around it so that it can use the payload cookie auth.

From the Nextjs Auth0 package:

Add the following environment variables to your .env.local file:

AUTH0_DOMAIN=
AUTH0_CLIENT_ID=
AUTH0_CLIENT_SECRET=
AUTH0_SECRET=
APP_BASE_URL=

The AUTH0_DOMAIN, AUTH0_CLIENT_ID, and AUTH0_CLIENT_SECRET can be obtained from the Auth0 Dashboard once you've created an application. This application must be a Regular Web Application.

The AUTH0_SECRET is the key used to encrypt the session and transaction cookies. You can generate a secret using openssl:

openssl rand -hex 32

The APP_BASE_URL is the URL that your application is running on. When developing locally, this is most commonly http://localhost:3000.

[!IMPORTANT] You will need to register the follwing URLs in your Auth0 Application via the Auth0 Dashboard:

• Add http://localhost:3000/auth/callback to the list of Allowed Callback URLs
• Add http://localhost:3000 to the list of Allowed Logout URLs

Middleware file needed, exactly like NextJS docs:

import { NextRequest, NextResponse} from 'next/server'

import { auth0 } from "payload-auth0/node"

export async function middleware(request: NextRequest) {
  return await auth0.middleware(request)
}

export const config = {
  matcher: [
    "/(auth|admin)/(login|logout|callback|profile|access-token|backchannel-logout)",
  ],
}

Installing the package

npm install payload-auth0
yarn install payload-auth0
pnpm install payload-auth0

Plugin Options

Note: There are more options defined however they all are not all tested or implemented correctly.

{
  enabled: boolean;

  strategyName: string;

  button = {
    component: PayloadComponent,
    text: string,
    className: string
  };

  hooks: {
    afterLogin: {
      handler(session, payload)
    }
  }
}

Contributing

More to come

License

The MIT License (MIT). Please see License File for more information.

Credits

This package was inspired by payload-oauth2.