This package now no longer works with the latest versions of Keystone and Next-Auth. For more background see keystonejs/keystone#8582. You can now implement Next-Auth directly in Keystone - see example https://github.com/keystonejs/keystone/tree/main/examples/custom-session-next-auth
This package enables the addition of social auth to keystone-6.
This uses NextAuth.js (https://next-auth.js.org/) project to add social auth to Keystone-6 (https://keystonejs.com/). Primary testing has been done with Auth0, happy for others to test other providers/give feedback or send through a PR.
Add package by yarn add @opensaas/keystone-nextjs-auth
then add the following to your keystone.ts
:
Add import...
import { createAuth } from '@opensaas/keystone-nextjs-auth';
import Auth0 from '@opensaas/keystone-nextjs-auth/providers/auth0';
Add you Auth configuration including providers
for Provider configuration see https://next-auth.js.org/providers/. For Provider configuration replace next-auth/providers/
with @opensaas/keystone-nextjs-auth/providers/
let sessionSecret = process.env.SESSION_SECRET;
if (!sessionSecret) {
if (process.env.NODE_ENV === 'production') {
throw new Error(
'The SESSION_SECRET environment variable must be set in production'
);
} else {
sessionSecret = '-- DEV COOKIE SECRET; CHANGE ME --';
}
}
const auth = createAuth({
listKey: 'User',
identityField: 'subjectId',
sessionData: `id name email`,
autoCreate: true,
resolver: async ({user, profile, account}) => {
const username = user.name as string;
const email = user.email as string;
return { email, username };
},
keystonePath: '/admin',
sessionSecret,
providers: [
Auth0({
clientId: process.env.AUTH0_CLIENT_ID || 'Auth0ClientID',
clientSecret: process.env.AUTH0_CLIENT_SECRET || 'Auth0ClientSecret',
domain: process.env.AUTH0_DOMAIN || 'opensaas.au.auth0.com',
}),
]
});
Wrap your keystone config in auth.withAuth
.
export default auth.withAuth(
config({
server: {},
db: {},
ui: {},
lists,
...
});
Provider configuration see https://next-auth.js.org/configuration/providers. For Keystone-6 Configuration see https://keystonejs.com/ for example see the example backend
- listKey - the list for authentication (generally
'User'
). Make sure any required fields are set using the*Map
fields, see note below. - identityField - The field that stores the identity/subjectId in keystone (generally
'subjectId'
). You will need to add this field to your list schema specified bylistKey
. An example can be found here. - sessionData - Data to be stored in the session ( something like
'id name email'
), - autoCreate - boolean to autocreate a user when they log in
- userMap:
key:value
pairs that define what is copied from the User object returned from NextAuth in the SignIn callback (https://next-auth.js.org/configuration/callbacks#sign-in-callback) Left side is Keystone side, right is what comes from NextAuth eg:{ subjectId: 'id', name: 'name' }
- accountMap - As Above but for the Account object
- profileMap - As Above but for the Profile object
- keystonePath - the path you want to access keystone from your frontend app (if required).
Note: The Keystone create-keystone-app
CLI app (generally run with yarn create keystone-app
/npm init keystone-app
) will set a required password
field on the User
list. If you've used this to set up your project you will need to modify your list schema to set the field as not required, or remove it entirely if you don't plan to use the default Keystone auth system at all.
If you want to run this package locally
After cloning run yarn install
and either:
yarn dev
to run both the frontend and backend oryarn dev:backend
for just the backend
The Demo App is configured in next.config.js
to proxy /api/auth
to the the host setup using the environment variable BACKEND_BASE_URL
in development set export BACKEND_BASE_URL=http://localhost:3000
you will also need to set your NEXTAUTH_URL
environment variable see https://next-auth.js.org/configuration/options for more information.