AUTHENTICATION DOCS

SETUP

Auth.js Route Handler (App Router)
Description: Route handler untuk Auth.js di App Router (Next.js).
Example: 
// app/api/auth/[...nextauth]/route.ts
import { handlers } from "@/auth"
export const { GET, POST } = handlers
Output: Auth API siap
Auth.js Config File
Description: File konfigurasi Auth.js (auth.ts) yang berisi providers, adapter, callbacks.
Example: 
// auth.ts
import NextAuth from "next-auth"
import GitHub from "next-auth/providers/github"

export const { handlers, auth, signIn, signOut } = NextAuth({
  providers: [GitHub]
})
Output: Auth instance
Auth.js Middleware
Description: Middleware untuk proteksi rute menggunakan Auth.js.
Example: 
// middleware.ts
import { auth } from "@/auth"
export default auth((req) => {
  if (!req.auth && req.nextUrl.pathname !== "/login") {
    return Response.redirect(new URL("/login", req.url))
  }
})
Output: Rute terproteksi
Installation
Description: Instalasi Auth.js dengan Next.js.
Example: 
pnpm add next-auth @auth/prisma-adapter
Output: Package terinstal

PROVIDERS

GoogleProvider
Description: Login dengan Google OAuth.
Example: 
import Google from "next-auth/providers/google"

Google({
  clientId: process.env.GOOGLE_CLIENT_ID,
  clientSecret: process.env.GOOGLE_CLIENT_SECRET
})
Output: Tombol Login Google
GitHubProvider
Description: Login dengan GitHub OAuth.
Example: 
import GitHub from "next-auth/providers/github"

GitHub({
  clientId: process.env.GITHUB_CLIENT_ID,
  clientSecret: process.env.GITHUB_CLIENT_SECRET
})
Output: Tombol Login GitHub
CredentialsProvider
Description: Login custom dengan email/password atau kredensial lainnya.
Example: 
import Credentials from "next-auth/providers/credentials"

Credentials({
  name: "credentials",
  credentials: {
    email: { label: "Email", type: "email" },
    password: { label: "Password", type: "password" }
  },
  async authorize(credentials) {
    const user = await verifyUser(credentials)
    return user ?? null
  }
})
Output: Login custom
DiscordProvider
Description: Login dengan Discord.
Example: 
import Discord from "next-auth/providers/discord"

Discord({
  clientId: process.env.DISCORD_CLIENT_ID,
  clientSecret: process.env.DISCORD_CLIENT_SECRET
})
Output: Tombol Login Discord
EmailProvider
Description: Login tanpa password via email (Magic Link).
Example: 
import Email from "next-auth/providers/email"

Email({
  server: process.env.EMAIL_SERVER,
  from: process.env.EMAIL_FROM
})
Output: Kirim email magic link
AppleProvider
Description: Login dengan Apple.
Example: 
import Apple from "next-auth/providers/apple"

Apple({
  clientId: process.env.APPLE_ID,
  clientSecret: process.env.APPLE_SECRET
})
Output: Tombol Login Apple

HOOKS-CLIENT

useSession
Description: Hook client untuk mendapatkan data sesi pengguna.
Example: 
import { useSession } from "next-auth/react"

export default function Component() {
  const { data: session, status } = useSession()
  return <p>{session?.user?.name}</p>
}
Output: { user: { name: 'Ridho', email: '...' } }
signIn
Description: Fungsi client untuk memulai proses login.
Example: 
import { signIn } from "next-auth/react"

<button onClick={() => signIn("google")}>Login with Google</button>
Output: Redirect ke Google
signOut
Description: Fungsi client untuk logout.
Example: 
import { signOut } from "next-auth/react"

<button onClick={() => signOut()}>Logout</button>
Output: Sesi dihancurkan
SessionProvider
Description: Provider client untuk membungkus aplikasi dan menyediakan sesi.
Example: 
// app/layout.tsx
import { SessionProvider } from "next-auth/react"

export default function RootLayout({ children, session }) {
  return <SessionProvider session={session}>{children}</SessionProvider>
}
Output: Sesi tersedia di klien

SERVER-SIDE

auth()
Description: Mendapatkan sesi di Server Component (Auth.js v5).
Example: 
import { auth } from "@/auth"

export default async function ServerPage() {
  const session = await auth()
  return <p>{session?.user?.name}</p>
}
Output: { user: { name: 'Ridho' } }
getServerSession (legacy)
Description: Mendapatkan sesi di server (NextAuth v4).
Example: 
import { getServerSession } from "next-auth"
import { authOptions } from "@/auth"

export async function getServerSideProps(ctx) {
  const session = await getServerSession(ctx, authOptions)
  return { props: { session } }
}
Output: { user: { ... } }
API Route Protection (App Router)
Description: Proteksi route handler dengan auth().
Example: 
import { auth } from "@/auth"

export async function GET() {
  const session = await auth()
  if (!session) return Response.json({ error: 'Unauthorized' }, { status: 401 })
  return Response.json({ data: 'ok' })
}
Output: Respons 401 jika tidak login

SESSION-MANAGEMENT

callbacks.jwt
Description: Menyesuaikan token JWT saat login/refresh.
Example: 
callbacks: {
  async jwt({ token, user }) {
    if (user) {
      token.role = user.role
    }
    return token
  }
}
Output: Token JWT berisi role
callbacks.session
Description: Menyesuaikan objek sesi yang dikirim ke klien.
Example: 
callbacks: {
  async session({ session, token }) {
    session.user.role = token.role
    return session
  }
}
Output: Session.user.role tersedia
session.strategy
Description: Strategi penyimpanan sesi: "jwt" (default) atau "database".
Example: 
session: {
  strategy: "jwt"
}
Output: Sesi disimpan di JWT
callbacks.signIn
Description: Mengontrol apakah user boleh login.
Example: 
callbacks: {
  async signIn({ user, account }) {
    if (account.provider === "google") {
      return user.email?.endsWith("@company.com")
    }
    return true
  }
}
Output: Hanya email company yang diizinkan
callbacks.redirect
Description: Mengarahkan ulang setelah login/logout.
Example: 
callbacks: {
  async redirect({ url, baseUrl }) {
    return url.startsWith(baseUrl) ? url : baseUrl
  }
}
Output: Redirect aman

DATABASE-ADAPTER

PrismaAdapter
Description: Menyimpan sesi, akun, dan user di database menggunakan Prisma.
Example: 
import { PrismaAdapter } from "@auth/prisma-adapter"
import { prisma } from "@/lib/prisma"

export const { handlers, auth } = NextAuth({
  adapter: PrismaAdapter(prisma)
})
Output: Database session
Schema Prisma untuk Auth.js
Description: Model yang diperlukan di schema.prisma.
Example: 
model Account {
  id String @id @default(cuid())
  userId String
  type String
  provider String
  providerAccountId String
  refresh_token String?
  access_token String?
  expires_at Int?
  token_type String?
  scope String?
  id_token String?
  session_state String?
  user User @relation(fields: [userId], references: [id], onDelete: Cascade)
  @@unique([provider, providerAccountId])
}

model Session {
  id String @id @default(cuid())
  sessionToken String @unique
  userId String
  expires DateTime
  user User @relation(fields: [userId], references: [id], onDelete: Cascade)
}

model User {
  id String @id @default(cuid())
  name String?
  email String? @unique
  emailVerified DateTime?
  image String?
  accounts Account[]
  sessions Session[]
}

model VerificationToken {
  identifier String
  token String @unique
  expires DateTime
  @@unique([identifier, token])
}
Output: Model siap
Database Migration
Description: Membuat tabel yang diperlukan Auth.js.
Example: 
pnpm exec prisma migrate dev --name auth-js
Output: Tabel Account, Session, User, VerificationToken

SECURITY

Middleware Route Protection
Description: Mengamankan rute dengan middleware Auth.js.
Example: 
// middleware.ts
import { auth } from "@/auth"

export default auth((req) => {
  if (!req.auth && req.nextUrl.pathname !== "/login") {
    return Response.redirect(new URL("/login", req.url))
  }
})

export const config = { matcher: ["/dashboard/:path*"] }
Output: Halaman /dashboard hanya untuk login
CSRF Protection
Description: Auth.js menangani CSRF secara otomatis pada API routes.
Example: 
Tidak perlu konfigurasi khusus.
Output: CSRF otomatis
JWT Encryption
Description: Token JWT dienkripsi dengan AUTH_SECRET.
Example: 
AUTH_SECRET=your-secret-key
Output: JWT terenkripsi
Custom JWT Encode/Decode
Description: Override encoding/dekoding JWT.
Example: 
jwt: {
  encode({ token, secret }) { ... },
  decode({ token, secret }) { ... }
}
Output: Kustom JWT

CUSTOM-PAGES

pages.signIn
Description: Halaman login kustom.
Example: 
pages: {
  signIn: '/auth/login'
}
Output: Redirect ke /auth/login
pages.error
Description: Halaman error kustom.
Example: 
pages: {
  error: '/auth/error'
}
Output: Redirect ke /auth/error
pages.verifyRequest
Description: Halaman verifikasi setelah email magic link dikirim.
Example: 
pages: {
  verifyRequest: '/auth/check-email'
}
Output: Redirect ke /auth/check-email
pages.newUser
Description: Halaman setelah user baru terdaftar.
Example: 
pages: {
  newUser: '/auth/welcome'
}
Output: Redirect ke /auth/welcome

EVENTS

events.signIn
Description: Callback saat user berhasil login.
Example: 
events: {
  async signIn({ user, account, isNewUser }) {
    console.log(`${user.name} signed in`)
  }
}
Output: Log login
events.signOut
Description: Callback saat user logout.
Example: 
events: {
  async signOut({ session }) { ... }
}
Output: Log logout
events.createUser
Description: Callback setelah user baru dibuat di database.
Example: 
events: {
  async createUser({ user }) {
    await sendWelcomeEmail(user.email)
  }
}
Output: Kirim email selamat datang
events.linkAccount
Description: Callback saat akun OAuth ditautkan ke user yang sudah ada.
Example: 
events: {
  async linkAccount({ user, account, profile }) { ... }
}
Output: Log penautan
events.session
Description: Callback saat sesi diakses (setiap request).
Example: 
events: {
  async session({ session, token }) { ... }
}
Output: Log aktivitas sesi

ADVANCED

Email Verification
Description: Verifikasi email setelah pendaftaran atau login.
Example: 
// Menggunakan Email provider atau credentials dengan verifikasi
callbacks: {
  async signIn({ user }) {
    if (!user.emailVerified) {
      throw new Error("Email not verified")
    }
    return true
  }
}
Output: Hanya email terverifikasi yang bisa login
Magic Link
Description: Login tanpa password dengan email magic link.
Example: 
// Gunakan EmailProvider dan kirim link ke email
import Email from "next-auth/providers/email"

Email({
  server: process.env.EMAIL_SERVER,
  from: process.env.EMAIL_FROM,
  maxAge: 10 * 60 // 10 menit
})
Output: Link login dikirim ke email
Credentials Flow with JWT
Description: Login custom dengan mengembalikan user dan membuat JWT.
Example: 
Credentials({
  async authorize(credentials) {
    const user = await verifyUser(credentials)
    if (user) {
      return { id: user.id, name: user.name, email: user.email, role: user.role }
    }
    return null
  }
})
Output: User object masuk ke JWT
Refresh Token Rotation
Description: Memperbarui access token OAuth yang kedaluwarsa.
Example: 
callbacks: {
  async jwt({ token, account }) {
    if (account) {
      token.accessToken = account.access_token
      token.refreshToken = account.refresh_token
    }
    // Refresh token jika expired
    if (Date.now() < token.expires_at * 1000) {
      return token
    }
    return refreshAccessToken(token)
  }
}
Output: Token selalu segar
Role-Based Access Control (RBAC)
Description: Membatasi akses berdasarkan role user.
Example: 
// Di middleware
import { auth } from "@/auth"

export default auth((req) => {
  if (req.auth?.user?.role !== "admin") {
    return Response.redirect(new URL("/403", req.url))
  }
})
Output: Hanya admin yang bisa mengakses