Auth.js のインストール
まずは、お使いのフレームワークに適したパッケージをインストールします。
npm install next-auth@beta
@auth/core
のインストールは不要です。ユーザーが @auth/core
と対話する必要はありません。
環境設定
必須の環境変数は AUTH_SECRET
のみです。これは、ライブラリがトークンとメール検証ハッシュを暗号化するために使用するランダムな値です。(詳細については デプロイ を参照してください)。公式の Auth.js CLI を実行して生成できます。
npx auth secret
これにより、フレームワークの規約(例:Next.js の .env.local
)を尊重して、.env
ファイルにも追加されます。
設定
次に、Auth.js 設定ファイルとオブジェクトを作成します。ここでは、ライブラリの動作を制御し、カスタム認証ロジック、アダプターなどを指定できます。すべてのフレームワークで、プロジェクトに auth.ts
ファイルを作成することをお勧めします。このファイルでは、フレームワーク固有の初期化関数にすべてのオプションを渡し、ルートハンドラー、サインインとサインアウトの方法などをエクスポートします。
このファイル名は任意で、どこに配置しても構いません。これは単なる規約です。
- アプリのルートに新しい
auth.ts
ファイルを作成し、次の内容を追加します。
./auth.ts
import NextAuth from "next-auth"
export const { handlers, signIn, signOut, auth } = NextAuth({
providers: [],
})
/app/api/auth/[...nextauth]/route.ts
の下にルートハンドラーを追加します。
💡
このファイルは App Router ルートハンドラーである必要がありますが、必要に応じてアプリの残りの部分は page/
の下に置くことができます。
./app/api/auth/[...nextauth]/route.ts
import { handlers } from "@/auth" // Referring to the auth.ts we just created
export const { GET, POST } = handlers
- セッションを維持するためのオプションのミドルウェアを追加します。これにより、呼び出されるたびにセッションの有効期限が更新されます。
./middleware.ts
export { auth as middleware } from "@/auth"
認証方法の設定
これで基本設定が完了しました!次に、最初の認証方法を設定し、providers
配列に記入します。