メインコンテンツへスキップ
ローテーションを使用するには、Auth0 SPA SDK を使用します。Auth0 SPA SDK は、トークンの保存、セッション管理、その他の処理を担います。

前提条件

オフラインアクセスを有効にし、クライアント SDK で offline_access スコープをリクエストするには、リフレッシュトークンローテーションを設定してください。

useRefreshTokens を有効にする

OAuth2 仕様に準拠して、ブラウザーが / にリフレッシュトークンを要求した場合、Auth0 がリフレッシュトークンを返すのは、そのクライアントで が有効になっている場合に限られます。 createAuth0ClientuseRefreshTokens オプションを使用します。既定値は false です。このオプションが false の場合、getTokenSilently() が呼び出されて新しい が必要になると、SDK は非表示の iframe と prompt=none を使って新しいアクセストークンの取得を試みます。 このオプションを true に設定すると、loginWithRedirect(), loginWithPopup(), getTokenSilently() の使用時に offline_access スコープが自動的に要求されます。getTokenSilently() が呼び出され、アクセストークンの有効期限が切れている場合、SDK はキャッシュ内のリフレッシュトークンと refresh_token グラントタイプを使用して /token エンドポイントを呼び出し、ID トークンとアクセストークンの更新を試みます。 サイレント再認証は、認証リクエスト時に prompt=none パラメーターを送信し、非表示の iframe を使用することで実現されます。これは、 にアクティブなユーザーセッションがあることが前提です。useRefreshTokenstrue に設定していても、キャッシュ内にリフレッシュトークンがない場合、SDK は iframe メソッドを使用します。これにより、ユーザーに再度ログインさせることなく、リフレッシュトークンの使用へサイレントに移行できます。 useRefreshTokenstrue でもキャッシュ内にリフレッシュトークンがないために交換に失敗した場合は、iframe メソッドにフォールバックします (サードパーティ Cookie がブロックされている場合は、これも失敗する可能性があります) 。

トークンの保存

SPA では、ID トークンとアクセストークンは認可サーバーから取得され、通常はメモリ内にキャッシュされます。トークンの更新 (ブラウザーの再読み込み、メモリキャッシュの消去、または有効期限切れによるもの) は、SDK が処理します。

次の例では、ローカルストレージとリフレッシュトークンの両方を使用するように SDK を設定する方法を示します。
const auth0 = await createAuth0Client({
    domain: '<your Auth0 domain>',
    client_id: '<your Auth0 client ID>',
    cacheLocation: 'localstorage',
    useRefreshTokens: true
    });
    
    // ログインすると offline_access スコープが自動的にリクエストされ、
    // 取得したリフレッシュトークンが保存されます
    auth0.loginWithRedirect();
    
    // アクセストークンのサイレントリフレッシュでは /token エンドポイントを使用し、
    // 'refresh_token' グラントとキャッシュ内のリフレッシュトークンが利用されます
    await auth0.getTokenSilently();

詳しく見る