Erreur de déchiffrement JWT et session null avec NextAuth sur Next.js 4

Question

Bonjour !
Je viens demander de l'aide, car je suis bloqué avec next.js version 4 concernant les callbacks et le JWT .
Voici le code de [...nextauth].js :
// Librairies
import NextAuth from 'next-auth';
import CredentialsProvider from 'next-auth/providers/credentials';
import { connectToDataBase } from '../../../helpers/mongodb';
import { verifyPassword } from '../../../helpers/auth';
export const authOptions = {
// Session aléatoire
// session: {
// maxAge: 30 * 24 * 60 * 60, // 30 days
// generateSessionToken: () => {
// return randomUUID?.() ?? randomBytes(32).toString('hex');
// },
// },
// Ajout des informations de l'user (email, pseudo, password)
providers: [
CredentialsProvider({
async authorize(credentials) {
const { email, password } = credentials;
// Connexion à MongoDB
const clientMongoDB = await connectToDataBase();
// Étape 1 - Utilisateur existant ?
const user = await clientMongoDB
.db()
.collection('users')
.findOne({ email: email });
if (!user) {
clientMongoDB.close();
throw new Error(
'Impossible de vous authentifier, merci de vérifier vos identifiants.'
);
}
// Étape 2 - Mot de passe est-il correct vs celui enregistré ?
const isValid = await verifyPassword(password, user.password);
if (!isValid) {
clientMongoDB.close();
throw new Error(
'Impossible de vous authentifier, merci de vérifier vos identifiants.'
);
}
// Étape 3 - Succès
clientMongoDB.close();
return {
email: user.email,
name: user.pseudo,
id: user._id,
roles: user.roles,
};
},
}),
],
// Ajout de nouvelles informations (cookies) à notre session user
callbacks: {
// Récupération du token
async jwt({ token, user }) {
if (user) {
token.accessToken = user.accessToken;
}
return token;
},
// Récupération du user
async session({ session, user }) {
// Check d'existence de user
user && (session.user = user);
return session;
},
secret: process.env.NEXTAUTH_SECRET,
},
};
export default NextAuth(authOptions);
Voici le problème rencontré :
event - compiled successfully in 36 ms (93 modules)
[next-auth][error][JWT_SESSION_ERROR]
https://next-auth.js.org/errors#jwt_session_error decryption operation failed {
message: 'decryption operation failed',
stack: 'JWEDecryptionFailed: decryption operation failed
' +
' at gcmDecrypt (C:\Users\Lordtoinou\Desktop\Believemy Formation\Next\projet1-next\node_modules\jose\dist\node\cjs\runtime\decrypt.js:67:15)
' +
' at decrypt (C:\Users\Lordtoinou\Desktop\Believemy Formation\Next\projet1-next\node_modules\jose\dist\node\cjs\runtime\decrypt.js:92:20)
' +
' at flattenedDecrypt (C:\Users\Lordtoinou\Desktop\Believemy Formation\Next\projet1-next\node_modules\jose\dist\node\cjs\jwe\flattened\decrypt.js:119:52)
' +
' at async compactDecrypt (C:\Users\Lordtoinou\Desktop\Believemy Formation\Next\projet1-next\node_modules\jose\dist\node\cjs\jwe\compact\decrypt.js:18:23)
' +
' at async jwtDecrypt (C:\Users\Lordtoinou\Desktop\Believemy Formation\Next\projet1-next\node_modules\jose\dist\node\cjs\jwt\decrypt.js:8:23)
' +
' at async Object.decode (C:\Users\Lordtoinou\Desktop\Believemy Formation\Next\projet1-next\node_modules\next-auth\jwt\index.js:64:7)
' +
' at async Object.session (C:\Users\Lordtoinou\Desktop\Believemy Formation\Next\projet1-next\node_modules\next-auth\core\routes\session.js:41:28)
' +
' at async AuthHandler (C:\Users\Lordtoinou\Desktop\Believemy Formation\Next\projet1-next\node_modules\next-auth\core\index.js:158:27)
' +
' at async getServerSession (C:\Users\Lordtoinou\Desktop\Believemy Formation\Next\projet1-next\node_modules\next-auth\next\index.js:113:19)
' +
' at async getServerSideProps (webpack-internal:///./src/pages/index.js:292:21)',
name: 'JWEDecryptionFailed'
}
http://localhost:3000
null
D'une part, l'objet username dans getServerSideProps dans index.js apparaît en null dans la console :
let username = null;
console.log(process.env.NEXTAUTH_URL);
if (session) {
username = session.user.name;
}
console.log(username);
D'autre part, le décryptage du JWT ne se fait pas correctement.
Comment est-il possible de résoudre le problème, s'il vous plaît ? Merci par avance !

Louis-Nicolas Leuillet · Accepted Answer

Je te recommande d'utiliser la version du cours pour NextAuth , et donc la version 3. Sans cela, et comme la nouvelle version est très récente, je vais avoir du mal à pouvoir t'aiguiller.
Enfin, pour ce qui concerne le problème avec l'objet username qui apparaît en null dans la console, cela peut être lié à un problème de typage ou de mauvaise manipulation de données. Vérifie que session existe, mais également session.user .
let username = null;
console.log(process.env.NEXTAUTH_URL);
if (session && session.user) {
username = session.user.name;
}
console.log(username);

Antoine Delamare · Answer

Bonjour !
Serait-il possible d'obtenir de l'aide pour le message ci-dessus svp ?
Merci par avance !

Antoine Delamare · Answer

Merci pour le retour !

autof · Answer

Bonjour Louis-Nicolas,
Je te remercie pour la doc ( https://next-auth.js.org/v3/configuration/callbacks ) que tu m'as transmis dans le cadre d'une autre question.
Je souhaiterais néanmoins émettre une critique( je sais que tu es ouvert à la critique à condition quelle soit positive). Cette partie est assez délicate et personnellement je regrette que tu n'aies pas partagé la démarche ou le raisonnement qui t'as conduit à partir de la doc à écrire ce code, cela aurait été fort utile je pense afin d'être davantage autonome quelque soit la version utilisée. Qu'en penses tu ?

Maxime Delville · Answer

Oui tkt j'ai aussi des problèmes dans ce genre avec next-auth quand je suivais le cours, utilise simplement la version du cours

Louis-Nicolas Leuillet · Answer

Hello Jean-Luc, oui en effet il y a des petits soucis si on utilise pas la même version que le cours, ça bouge très souvent.

Erreur de déchiffrement JWT et session null avec NextAuth sur Next.js 4

Développez des applications full-stack en JavaScript avec NextJS et React