- Install next-auth@beta, bcryptjs, zod, and @auth/prisma-adapter - Create auth.ts with credentials provider and JWT session strategy - Create auth.config.ts for edge-compatible middleware configuration - Add NextAuth type extensions for session and JWT - Create API route handler for authentication - Configure environment variables for NextAuth - Add AUTH_SETUP.md documentation Task: 1. Set up authentication infrastructure Requirements: 1.1, 2.1
111 lines
2.8 KiB
Markdown
111 lines
2.8 KiB
Markdown
# Authentication Setup
|
|
|
|
This document describes the authentication infrastructure setup for the Ultimate Lists App.
|
|
|
|
## Installed Dependencies
|
|
|
|
- **next-auth@5.0.0-beta** - NextAuth.js v5 (Auth.js) for authentication
|
|
- **bcryptjs** - Password hashing library
|
|
- **zod** - Schema validation for forms and API inputs
|
|
- **@auth/prisma-adapter** - Prisma adapter for NextAuth
|
|
- **@types/bcryptjs** - TypeScript types for bcryptjs
|
|
|
|
## Configuration Files
|
|
|
|
### `auth.ts`
|
|
Main authentication configuration file that exports:
|
|
- `handlers` - HTTP handlers for the auth API routes
|
|
- `signIn` - Function to sign in users
|
|
- `signOut` - Function to sign out users
|
|
- `auth` - Function to get the current session
|
|
|
|
Features:
|
|
- Credentials provider for email/password authentication
|
|
- JWT session strategy
|
|
- Password verification with bcrypt
|
|
- Custom callbacks for JWT and session
|
|
- Custom auth pages configuration
|
|
|
|
### `auth.config.ts`
|
|
Edge-compatible auth configuration for middleware:
|
|
- Route authorization logic
|
|
- Custom auth pages
|
|
- Provider configuration placeholder
|
|
|
|
### `types/next-auth.d.ts`
|
|
TypeScript type extensions for NextAuth:
|
|
- Adds `id` field to Session user
|
|
- Adds `id` field to JWT token
|
|
- Defines User interface
|
|
|
|
### `app/api/auth/[...nextauth]/route.ts`
|
|
API route handler that exports GET and POST handlers from NextAuth.
|
|
|
|
## Environment Variables
|
|
|
|
The following environment variables have been added to `.env`:
|
|
|
|
```env
|
|
NEXTAUTH_URL=http://localhost:3000
|
|
NEXTAUTH_SECRET=your-secret-key-here-please-change-in-production
|
|
AUTH_SECRET=your-secret-key-here-please-change-in-production
|
|
```
|
|
|
|
**Important:** Generate secure secrets for production using:
|
|
```bash
|
|
openssl rand -base64 32
|
|
```
|
|
|
|
## Next Steps
|
|
|
|
1. Update the Prisma schema to add User, Collaborator, and Invitation models (Task 2)
|
|
2. Implement user registration functionality (Task 3)
|
|
3. Implement authentication functionality (Task 4)
|
|
4. Create authentication UI components (Task 6)
|
|
5. Implement route protection middleware (Task 7)
|
|
|
|
## Usage
|
|
|
|
### Getting the current session
|
|
```typescript
|
|
import { auth } from "@/auth"
|
|
|
|
export default async function Page() {
|
|
const session = await auth()
|
|
|
|
if (!session?.user) {
|
|
// User is not authenticated
|
|
return <div>Please log in</div>
|
|
}
|
|
|
|
// User is authenticated
|
|
return <div>Welcome {session.user.email}</div>
|
|
}
|
|
```
|
|
|
|
### Sign in
|
|
```typescript
|
|
import { signIn } from "@/auth"
|
|
|
|
await signIn("credentials", {
|
|
email: "user@example.com",
|
|
password: "password123",
|
|
redirectTo: "/",
|
|
})
|
|
```
|
|
|
|
### Sign out
|
|
```typescript
|
|
import { signOut } from "@/auth"
|
|
|
|
await signOut({ redirectTo: "/auth/login" })
|
|
```
|
|
|
|
## Security Notes
|
|
|
|
- Passwords are hashed using bcrypt before storage
|
|
- JWT tokens are used for stateless sessions
|
|
- Session tokens are stored in httpOnly cookies
|
|
- All credentials are validated using Zod schemas
|
|
- Failed login attempts return null without revealing whether email exists
|