Zenn
Closed11

@auth0/nextjs-auth0 v4 マイグレーションガイドのメモ

Auth0
makototmakotot

v3からv4へのマイグレーションガイド
https://github.com/auth0/nextjs-auth0/blob/main/V4_MIGRATION_GUIDE.md

makototmakotot
# 必須のenv

AUTH0_DOMAIN # AUTH0_ISSUER_BASE_URLからリネームされた値。スキーム含まない形のみ許容に。
AUTH0_CLIENT_ID
AUTH0_CLIENT_SECRET
AUTH0_SECRET
APP_BASE_URL # AUTH0_BASE_URLからリネームされた値。
makototmakotot
  • app routerの場合、v3では/app/api/auth/[auth0]/route.tsにhandleAuthでRoute Handlerを追加する必要があった
  • v4では、middlewareでrouteが自動的にマウントされる
import type { NextRequest } from "next/server"

import { auth0 } from "./lib/auth0"

export async function middleware(request: NextRequest) {
  return await auth0.middleware(request)
}
  • SDK公式のexample
  • /apiのプレフィックスも不要になった
    • 例えば、/api/auth/loginは /auth/loginに
  • routeのリスト
  • Allowed Callback URLsの修正が適宜必要になる
makototmakotot
  • v4ではミドルウェアのマウントが必須
    • ミドルウェアがSDKの中心的な役割
makototmakotot
  • デフォルトで保護するルートはない
  • 保護するルートに対してはmiddlewareでgetSessionを呼ぶ
  • データソースのなるべく近くでセキュリティチェックが望ましい
makototmakotot
  • <UserProvider /> は<Auth0Provider />にリネームされた
  • v4ではこのプロバイダーの利用が必須ではない
makototmakotot
  • withPageAuthRequiredやwithApiAuthRequiredは廃止
  • サーバーサイドならgetSessionで認証状態チェック入れる
  • ブラウザならuseUserhookで代替
makototmakotot
  • v3におけるカスタムハンドラーのauthorizationParamsは、v4でエンドポイントのURLにクエリーパラメーターでつけられるように
    • /auth/login?audience=urn:my-api
  • SDK初期化の設定に入れる方法もある
makototmakotot
  • v3までid tokenに含まれるclaimsは全てセッションのuserオブジェクトへと追加されてた
    • cookieのサイズ肥大化に影響してた
  • v4からはデフォルトで特定のclaimsのみに限定される
makototmakotot
  • @auth0/nextjs-auth0/edgeのexportはなくなった
    • デフォルトでedge互換
  • SDKが保存するcookieは SameSite=Laxがデフォルト
  • touchSessionメソッドは廃止
  • getAccessTokenをReact Server Componentsで呼べるように
このスクラップは2ヶ月前にクローズされました