ネイティブからWebへのSSOの設定と実装

アプリケーションでネイティブからWebへのSSOを利用するための設定方法を学びます。

​

ネイティブからWebへのSSOを設定する

ネイティブからWebへのシングルサインオン (SSO) を使用するには、Auth0のManagement APIを使用して、ネイティブアプリケーションとWeb (Single Page AppまたはRegular Web App) でセッションを作成および管理するよう設定します。

Management APIまたはAuth0 CLIを使用するには、アクセストークンが必要です。

ネイティブからWebへのSSOを設定するには、session_transfer_tokensを作成・管理し、ネイティブアプリケーションとWeb アプリケーションを設定する必要があります。

ネイティブからWebへのSSOでは、次のSDKがサポートされています: Auth0 Android SDK、Auth0 Swift SDK、および Auth0 React Native SDK。

ネイティブからWebへのSSOのサポートは、次のツールで利用できます: Auth0 Deploy CLI、Auth0 Terraform Provider、および Auth0 CLI。

ネイティブからWebへのSSOは、リフレッシュトークンを返すすべての認証フローをサポートしています。たとえば、Resource Owner Password Flow や Proof Key for Code Exchange (PKCE) を使用する認可コードフロー です。

​

Session Transfer Token の作成と管理

最初の Management API 呼び出しでは、Native アプリケーションと Web アプリケーションで次のことが可能になります。

• session_transfer_tokens の作成と管理
• Cookie または URL パラメーターを介して Web ブラウザーでセッションを作成する
• IP アドレスまたは ASN を使って、セッションをユーザーのデバイスに紐付ける

既存のアプリケーションの場合は、Update a Client エンドポイントに PATCH 呼び出しを行います。新しいアプリケーションを作成するには、Create a Client エンドポイントに POST 呼び出しを行います。

{
  "session_transfer": {
    "can_create_session_transfer_token": false,
    "allowed_authentication_methods": ["cookie", "query"],
    "enforce_device_binding": "ip", // "none" や "asn" も指定可能,
    "allow_refresh_token": false,
    "enforce_cascade_revocation": true,
    "enforce_online_refresh_tokens": true
  }
}

​

ネイティブアプリケーションを設定する

ユーザーが認証されると、Auth0 は アクセストークン と ID トークン、さらに (任意で) リフレッシュトークン を返します。

ネイティブアプリケーションを設定して、リフレッシュトークンを Session Transfer Token と交換できます。Web アプリケーションがクッキーの挿入をサポートしていない場合は、Session Transfer Token を URI パラメーターとして渡せるように、ネイティブアプリケーション側で Web アプリケーションの Login URI も設定する必要があります。

• Auth0 Dashboard を使用してネイティブアプリケーションを更新します。

  1. Dashboard > Applications に移動します。
  2. アプリケーションを選択するか、アプリケーションを作成します。
  3. 設定 タブを選択します。
  4. Session Transfer で Allow Native to Web SSO を有効にします。
  5. Require Cascade Revocation を選択すると、Web アプリケーションのセッションと関連するトークンが自動的に取り消されます。
  6. Save を選択してアプリケーションを更新します。

• Update a Client エンドポイントで、Management API の Access Token を使用してネイティブアプリケーションを更新します。

• Auth0 CLI を使用して、Native アプリケーションを更新します:

​

Web アプリケーションを設定する

Session Transfer Token を有効にする前に、追加のパラメーターを処理できるよう、Web アプリケーションの Application Login URI を設定してください。URI の詳細については、Application Settings を参照してください。

• Auth0 Dashboard を使用して Web アプリケーションを更新します。

  1. Dashboard > Applications に移動します。
  2. Web アプリケーションを選択するか、新規作成します。
  3. 設定 タブを選択します。
  4. Session Transfer で Native to Web SSO Methods を有効にします。
  5. Cookie Authentication と Query Authentication を選択します。
  6. Device Binding Method で、None、ASN Binding、または IP Address Binding のいずれかを選択します。
  7. セッション転送後に新しいリフレッシュトークンを発行するには、Allow Refresh Token Requests を有効にします。
  8. Use online refresh tokens を選択します。
  9. Web アプリケーションを更新するには、Save を選択します。

• Update a Client エンドポイントで Management API Access Token を使用して Web アプリケーションを更新します。

• Auth0 CLI を使用して Web アプリケーションを更新します。

​

ネイティブからWebへのSSOを実装する

Native to Web Single SSO では、認証済みユーザーが ネイティブアプリケーションから Web アプリケーションへシームレスに移動できるユーザー体験を実現できます。

これを実現するには、ネイティブアプリケーションでリフレッシュトークンを Session Transfer Token に交換し、その Session Transfer Token を URL またはクッキー経由で Web アプリケーションに送信して、セッションを認可する必要があります。

• クライアントでallow_refresh_tokenが無効になっていても、アプリケーションがoffline_accessを要求した場合、Auth0はrefresh_tokenを発行しませんが、認証自体は引き続き機能します。

• Refresh Tokenのローテーションが有効になっている場合、Auth0はトークン交換の呼び出しで新しいrefresh_tokenを返します。リフレッシュトークン交換は、コードから Web アプリケーションを開く直前に実行する必要があります。

​

Native アプリケーションで

​

Step 1: リフレッシュトークンを Session Transfer Token に交換する

ネイティブアプリケーションで /token エンドポイントを使用して、リフレッシュトークンを Session Transfer Token に交換します。

• Swift、Android、または React Native SDK を使用して、リフレッシュトークンを Session Transfer Token に交換する:

Swift SDK

credentialsManager.ssoCredentials { result in
    switch result {
    case .success(let ssoCredentials):
        print("Obtained SSO credentials: \(ssoCredentials)")
    case .failure(let error):
        print("Failed with: \(error)")
    }
}

// または、async/await を使用

do {
    let ssoCredentials = try await credentialsManager.ssoCredentials()
    print("Obtained SSO credentials: \(ssoCredentials)")
} catch {
    print("Failed with: \(error)")
}

Android SDK

secureCredentialsManager.getSsoCredentials(
    mapOf(),  // オプションのパラメーター
    object : Callback<SSOCredentials, CredentialsManagerException> {
        override fun onSuccess(result: SSOCredentials) {
            // result.sessionTransferToken を使用して
            // アプリ内の Web セッションでユーザーを認証します
        }

        override fun onFailure(error: CredentialsManagerException) {
            // エラーを処理
        }
    }
)

React Native SDK

// フックを使用
import { useAuth0 } from 'react-native-auth0';

function MyComponent() {
  const { getSSOCredentials } = useAuth0();

  const openWebApp = async () => {
    try {
      const ssoCredentials = await getSSOCredentials();
      // ssoCredentials.sessionTransferToken を使用して
      // アプリ内の Web セッションでユーザーを認証します
      console.log('Session Transfer Token:', ssoCredentials.sessionTransferToken);
    } catch (error) {
      console.error('Failed to get SSO credentials:', error);
    }
  };
}

// Auth0 クラスを使用
import Auth0 from 'react-native-auth0';

const auth0 = new Auth0({
  domain: '{yourDomain}',
  clientId: '{yourClientId}',
});

const ssoCredentials = await auth0.credentialsManager.getSSOCredentials();
console.log('Session Transfer Token:', ssoCredentials.sessionTransferToken);

• HTTP を使用して、リフレッシュトークンを Session Transfer Token に交換する:

これらのサンプルでは、動的な値にプレースホルダーを使用しています。プレースホルダーは、お使いの Auth0 ドメイン、client_id、既存の refresh_token に置き換えてください。

Auth0 テナントは、1 回限り使用可能で有効期間の短い (1 分間) session_transfer_token を返します。

{
    "access_token": "{session_transfer_token}",
    "issued_token_type": "urn:auth0:params:oauth:token-type:session_transfer_token",
    "token_type": "N_A",
    "expires_in": 60
}

Refresh Tokenのローテーションが有効な場合、この交換処理ではリフレッシュトークンも返されます。

認証時にID トークンをリクエストしていた場合、この呼び出しではID トークンも返されます。

​

ステップ 2: URL またはクッキーを介して Session Transfer Token を送信する

設定されている allowed_authentication_methods に応じて、session_transfer_token を Web アプリケーションに送信する方法は 2 つあります。

オプション 1: session_transfer_token を Cookie として送信する

WebView またはブラウザーを使用する Web アプリケーションが Cookie の挿入をサポートしている場合は、次のように ネイティブアプリケーションを設定できます。

• session_transfer_token を Cookie に追加します。
• WebView またはブラウザーを使用して Web アプリケーションを開きます。
• Web アプリケーションから Auth0 テナントまたは カスタムドメイン にログインします。 session_transfer_token が Cookie に含まれているため、ユーザーに第 1 認証要素の入力は求められません。

オプション 2: URLパラメーターとして session_transfer_token を送信する

Web アプリケーションが Cookie の挿入をサポートしていない場合は、ネイティブアプリケーションで URLパラメーターを使用するよう設定することで、次のことを行えます。

• URLパラメーターとして session_transfer_token を追加する。
• WebView またはブラウザーで Web アプリケーションを開く。
• session_transfer_token を URLパラメーターとして /authorize エンドポイントに付加し、Web アプリケーションにログインする。session_transfer_token は有効で信頼されているため、Auth0 テナントは第1認証要素での認証を要求せずにユーザーを認証します。

​

Web アプリケーションで

Session Transfer Token が cookie として送信される場合、ブラウザーが /authorize エンドポイントへのリクエストにその cookie を含めて送信するため、追加の設定は不要です。

URLパラメーターを使用して Web アプリケーションに Native to Web Web Single SSO を実装するには、次のようにします。

​

オプション 1: Web アプリケーションのリクエストに Session Transfer Token を追加する

アプリケーションのログイン URL から、session_transfer_token を URL パラメータとして送信して /authorize endpoint にリダイレクトします。

​

オプション 2: Auth0 SDKs を使用して Session Transfer Token を Web アプリケーションに追加する

Auth0 SDKs は Native to Web Single SSO を自動ではサポートしておらず、/authorize エンドポイントへのリクエストに session_transfer_token は含まれません。

以下は、Auth0 SDKs を使用して /authorize エンドポイントへのリクエストで session_transfer_token をリダイレクトする Web アプリケーションの例です。

Node (Express.js)

Web アプリケーションで Express.js または Auth0 Express SDK を使用している場合は、以下のコードで session_transfer_token に対応するミドルウェアを追加できます。

javascript

const baseConfig = {
  authRequired: false,
  auth0Logout: true
};

// session_transfer_tokenを自動検出するためにミドルウェアを拡張する
app.use((req, res, next) => {
  const { session_transfer_token } = req.query;

  // stateの漏洩を防ぐために、リクエストごとに新しい設定を作成する
  const config = { ...baseConfig };

  if (session_transfer_token) {
    config.authorizationParams = {
      session_transfer_token,
    };
  }

  auth(config)(req, res, next);
});

Auth0 SPA SDK (@auth0/auth0-spa-js)

Web アプリケーションで Auth0 SPA SDK を使用している場合は、authorizationParams を通じて session_transfer_token を loginWithRedirect() に渡せます。

typescript

import { Auth0Client } from '@auth0/auth0-spa-js';

const auth0 = new Auth0Client({
  domain: '{yourDomain}',
  clientId: '{yourClientId}',
});

// URLクエリパラメータからsession_transfer_tokenを取得する（ネイティブアプリから渡される）
const urlParams = new URLSearchParams(window.location.search);
const sessionTransferToken = urlParams.get('session_transfer_token');

// session_transfer_tokenを使用してloginWithRedirectを呼び出す
if (sessionTransferToken) {
  await auth0.loginWithRedirect({
    authorizationParams: {
      session_transfer_token: sessionTransferToken,
      redirect_uri: window.location.origin,
    },
  });
}

Auth0 React SDK (@auth0/auth0-react)

Auth0 React SDK を使用している Web アプリケーションでは、useAuth0 フックの loginWithRedirect を使って session_transfer_token を渡せます。

typescript

import { useEffect } from 'react';
import { useAuth0 } from '@auth0/auth0-react';

function App() {
  const { loginWithRedirect, isAuthenticated, isLoading } = useAuth0();

  useEffect(() => {
    if (isLoading || isAuthenticated) return;

    const urlParams = new URLSearchParams(window.location.search);
    const sessionTransferToken = urlParams.get('session_transfer_token');

    if (sessionTransferToken) {
      loginWithRedirect({
        authorizationParams: {
          session_transfer_token: sessionTransferToken,
        },
      });
    }
  }, [loginWithRedirect, isLoading, isAuthenticated]);

  return <div>...</div>;
}

SAML と WS-Federation

Web アプリケーションで SAML または WS-Fed のサービスプロバイダーを使用し、Auth0 を IdP として使用している場合は、session_transfer_token を URLパラメーターとして Auth0 の /authorize エンドポイントに送信できます。また、redirect_uri には SAML または WS-Fed のサインイン URL を指定します。

​

Organizations でのネイティブからWebへのSSO

ネイティブからWebへのSSO は Organizations をサポートしています。ユーザーがネイティブアプリケーションで organization を指定して認証されると、Session Transfer Token には組織コンテキストが含まれます。

Organizations をネイティブからWebへのSSO と併用する場合、Web アプリケーションの /authorize リクエストに含まれる organization パラメーターは、Session Transfer Token に関連付けられた organization と一致している必要があります。一致しない場合、認証は失敗し、ユーザーは再度ログインを求められます。

Organizations をネイティブからWebへのSSO と併用するには:

1. ネイティブアプリケーションで organization を指定してユーザーを認証します:

javascript

// organizationを使用したNativeアプリのログイン
await authorize({
  organization: 'org_abc123',
  scope: 'openid profile email offline_access'
});

2. Web アプリケーションにリダイレクトする際は、/authorize リクエストに同じ organization を含めます:

bash

https://{yourDomain}/authorize?
  client_id={yourWebClientId}&
  redirect_uri={yourRedirectUri}&
  response_type=code&
  organization=org_abc123&
  session_transfer_token=YOUR_SESSION_TRANSFER_TOKEN

/authorize リクエスト内の organization が Session Transfer Token 内の organization と一致しない場合、Session Transfer Token は拒否され、ユーザーは再認証のためログインページにリダイレクトされます。イベントの説明が “シングルサインオンに失敗しました: Session Transfer Token の organization の不一致が検出されました。” の警告ログが、テナントログに出力されます。

​

Session Transfer Token with Actions

Actions で session_transfer_token を使用すると、認証後のリスク検知と対応機能を設定し、ユーザー保護を強化できます。

そのために、post-login Action オブジェクト event.session_transfer_token には、一意の client_id、scope、ip、asn、user_agent などの request 情報や、cityName、countryCode などの geoip 情報をはじめとする関連情報が含まれます。詳しくは、Actions Triggers: post-login - Event Object をご覧ください。

以下の Action コードでは、位置情報に基づいて transaction を動的に拒否できます。

javascript

/**
* PostLogin フローの実行中に呼び出されるハンドラー。
*
* @param {Event} event - ユーザーとログインコンテキストに関する詳細情報。
* @param {PostLoginAPI} api - ログインの動作を変更するメソッドを提供するインターフェース。
*/
exports.onExecutePostLogin = async (event, api) => {
   if(
     event.session_transfer_token &&
     event.session_transfer_token.request.geoip.countryCode !== event.request.geoip.countryCode
     ) {
     api.access.deny("Network mismatch detected")
   }
};

​

親リフレッシュトークンのメタデータにアクセスする

ネイティブからWebへのSSOでは、SSOフローの開始に使用された親リフレッシュトークンのメタデータにアクセスできます。これにより、ネイティブアプリケーションで収集したコンテキスト情報 (デバイスの完全性、リスクシグナル、カスタムコンテキストなど) を、session_transfer_token から作成されるWebセッションに引き継げます。

Auth0 では、この情報を event.session.session_transfer.parent_refresh_token.metadata オブジェクトとして Post Login Actions から利用できます。これにより、プラットフォーム間でメタデータを安全かつ標準化された方法で受け渡せます。

使用例: モバイルアプリがリスクデータ (デバイススコア、位置情報など) を収集し、それをリフレッシュトークンのメタデータに保存します。ネイティブアプリがネイティブからWebへのSSOフローを開始すると、そのメタデータは対応するWebセッションで Actions を通じて自動的に利用できるようになります。

以下の Action コードを使用すると、ネイティブアプリケーションから渡されるデバイス信頼メタデータに基づいて、条件付きアクセスのロジックを実行できます。

javascript

/**
* PostLoginフローの実行中に呼び出されるハンドラー。
*
* @param {Event} event - ユーザーおよびログイン時のコンテキストに関する詳細情報。
* @param {PostLoginAPI} api - ログインの動作を変更するために使用できるメソッドを持つインターフェース。
*/
exports.onExecutePostLogin = async (event, api) => {
  // 親リフレッシュトークン（ネイティブアプリ）からメタデータを取得する
  const parentMetadata = event.session?.session_transfer?.parent_refresh_token?.metadata;

  if (parentMetadata) {
    const deviceTrustLevel = parentMetadata.device_trust;

    if (deviceTrustLevel !== 'high') {
      api.access.deny("Device trust level insufficient.");
    }

    // ネイティブアプリのコンテキストに基づいてクレームを追加することも可能
    if (parentMetadata.subscription_tier) {
      api.idToken.setCustomClaim('subscription_tier', parentMetadata.subscription_tier);
    }
  }
};

​

モニタリング

テナントのログを確認することで、ネイティブからWebへのSSOのアクティビティをモニタリングできます。

​

Token Exchange のログ

• sertft : リフレッシュトークン交換の成功。このログは、audience フィールドが "audience":"urn:$auth0Domain:session_transfer" の場合、ネイティブからWebへのSSOでの交換に対応します
• fertft: リフレッシュトークン交換の失敗。このログは、audience フィールドが "audience": "urn:$auth0Domain:session_transfer" の場合、ネイティブからWebへのSSOでの交換に対応します

​

セッション転送の検証に関する警告ログ

Auth0 は、/authorize リクエスト中にSession Transfer Tokenの検証が失敗すると、警告ログ (w) を出力します。これらのログは、ネイティブからWebへのSSO の問題をトラブルシューティングするのに役立ちます。

イベントの説明	原因
Single Sign-On failed: Session Transfer Token not found or expired. This may indicate token reuse or expiration.	Session Transfer Token が見つからない、すでに使用されている、または有効期限が切れています (トークンは1回しか使用できず、1分で期限切れになります) 。
Single Sign-On failed: Session Transfer Token device binding validation failed due to IP/ASN mismatch.	Web リクエストの IP アドレスまたは ASN が、Session Transfer Token に設定されたデバイスバインディングと一致しません。
Single Sign-On failed: Session Transfer Token organization mismatch detected.	/authorize リクエストの organization パラメーターが、Session Transfer Token 内の organization と一致しません。
Single Sign-On failed: Session Transfer Token user mismatch detected.	既存の Auth0 セッションが、Session Transfer Token とは異なるユーザーに属しています。
Single Sign-On failed: Parent refresh token not found. Session Transfer Token won't be used for session establishment.	Session Transfer Token の作成に使用された親リフレッシュトークンが、取り消されているか削除されています。