When developing a web application, one thing that cannot be avoided is the implementation of an “authentication function.” However, implementing password hashing, session management, CSRF countermeasures, OAuth integration, etc. on your own from scratch poses high security risks and requires significant development costs.
Therefore, this time we will introduce some best practices for implementing secure authentication using “NextAuth.js” (currently Auth.js), which is the de facto standard for authentication in Next.js environments.
Best practice 1: Basically prioritize OAuth (social login)
Managing your own passwords means you run the risk of information leakage. When using NextAuth.js, first consider introducing a social login (OAuth provider) such as Google or GitHub. Setting up the provider is surprisingly easy, just write the Client ID and Secret in the configuration file and add a few lines of code to create a robust authentication system. It also saves users the trouble of remembering passwords, which helps improve registration rates.
Best practice 2: Differential use of JWT and database session
With NextAuth.js, you can select two types of session retention methods: “JWT (JSON Web Token)” and “database session”.
- Advantages of JWT: No database queries required, resulting in faster response times and easier scaling. This is recommended by default.
- Advantages of database sessions: Sessions can be easily invalidated immediately (for example, by an administrator forcing a specific user to log out).
Design according to your requirements, such as database sessions for business systems that require high security controls, and JWT for performance-oriented consumer apps.
Best Practice 3: Ensure route protection with middleware
By combining NextAuth.js with the Middleware features introduced in Next.js 12 and later, you can firmly block unauthorized access to specific pages (e.g. /dashboard/*).
The traditional method of redirecting using useSession within a component had the problem of momentary screen flickering (FOUC), but by using middleware that runs on the edge side, it is possible to seamlessly redirect to the login screen before the user sees it.
Best Practice 4: Tight management of secret keys
To run NextAuth.js in a production environment, it is necessary to set the environment variable NEXTAUTH_SECRET.
This is the most important key used to encrypt the token, and if it is compromised, it directly leads to a major vulnerability. Please ensure that your team manages the environment variables safely on the environment variable settings screen of the deployment environment (such as Vercel) and never commits them to the source code (Git).
Avoid reinventing the wheel and leave the burden of authentication to a trusted library. That’s the golden rule of modern secure web development.