• js
  • next
  • next-auth
  • auth.js

NextAuth.js v4 から Auth.js v5 への移行

NextAuth.js v4 から v5 への Logto 統合を移行するためのガイド。

Sijie
Sijie
Developer

NextAuth.js バージョン 5 は next-auth パッケージの大規模な再構築であり、Logto を含むさまざまな統合に影響を与える大幅な更新が含まれています。このガイドでは、NextAuth.js v4 から Auth.js v5 への Logto 統合の移行手順を説明します。

変更点の理解

Auth.js v5

NextAuth.js v5 はいくつかの重大な変更を導入しており、その主な変更点は「OIDC/OAuth プロバイダー」の統合方法に影響します。公式ドキュメントでは、「Auth.js はより厳格な OAuth/OIDC 仕様に準拠する @auth/core に基づいて構築されており、既存の OAuth プロバイダーの一部が壊れる可能性があります」と述べられており、Logto ユーザーにとってはプロバイダーの設定を更新する必要があることを意味します。

変更点の詳細については、公式の移行ガイドを参照できます。

Logto プロバイダー設定

Logto のプロバイダー設定が更新されました:

  • タイプが oauth から oidc に変更されました。
  • wellKnown エンドポイントが削除され、代わりに issuer フィールドを指定する必要があります。
  • id_token 署名アルゴリズムの指定は不要で、ES384 をサポートし、これが自動的に検出されます。

ステップバイステップ移行ガイド

プロバイダー設定を pages/api/auth/[...nextauth].js ファイルで新しい設定テンプレートに更新してください:

ステップ 1: プロバイダータイプの変更

プロバイダータイプを oauth から oidc に変更します。

ステップ 2: issuer フィールドの追加

プロバイダー設定に issuer フィールドを追加します。Logto アプリケーションの詳細ページから issuer の値を取得できます。「Issuer endpoint」フィールドに記載されています。Logto クラウドサービスを使用している場合、https://xxxx.logto.app/oidc のようになります。

その後、wellKnown フィールドを削除できます。

ステップ 3: id_token_signed_response_alg 署名アルゴリズムの削除

プロバイダー設定で id_token_signed_response_alg 署名アルゴリズムを指定する必要はありません。今後は ES384 をサポートし、これが自動的に検出されます。

プロジェクトの更新

プロバイダー設定を更新した後、next-auth パッケージを v5 に更新する必要があります。公式の移行ガイド に従ってパッケージを更新し、アプリケーションが予想通りに動作することを確認してください。