Lightning Out 2.0 の認証の設定

Lightning Out 2.0 エンドポイントからの前面ドア URL の取得

Lightning Out 2.0 サーブレットは、CORS サポートを提供することで UI Bridge API を拡張し、Salesforce リソースのアクセスを Lightning Out 2.0 アプリケーションのみに制限します。

Lightning Out 2.0 サーブレットでは、標準の UI Bridge API エンドポイントservices/oauth2/singleaccessの代わりに、特殊なエンドポイントservices/oauth2/lightningoutsingleaccessが使用されます。このエンドポイントは、有効な Salesforce セッション ID（SID）を cookie として設定する Lightning Web Runtime アプリケーションに移動します。SID は、今後のすべての要求と共に組織に送信されます。そのため、Lightning Out 2.0 アプリケーションの使用中にユーザーが再認証する必要はありません。

重要 Lightning Out 2.0 UI Bridge API エンドポイントを要求する前に、Lightning Out 2.0 アプリケーション マネージャで Lightning Out 2.0 アプリケーションがイネーブルになっていることを確認します。「Build a Lightning Out 2.0 App」を参照してください。

フロントドア URL を生成するには、外部アプリケーションから POST 要求を https://MyDomainName.my.salesforce.com/services/oauth2/lightningoutsingleaccess エンドポイントに送信します。Lightning Out 2.0 アプリケーション ID と OAuth 2.0 アクセストークンをリクエストボディパラメータとして含めます。

cURL を使用する POST 要求の例を次に示します。

curl -X POST \
  'https://MyDomainName.my.salesforce.com/services/oauth2/lightningoutsingleaccess' \
--form 'access_token="access-token-value"' \
--form 'lightning_out_app_id="app-id"'

JavaScript を使用する別の POST 要求の例を次に示します。Content-Type ヘッダーが application/x-www-form-urlencoded として宣言されていることを確認します。

fetch(
    "https://MyDomainName.my.salesforce.com/services/oauth2/lightningoutsingleaccess", 
    {
        method: "POST",
        headers: {
            "Content-Type": "application/x-www-form-urlencoded"
        },
        body: "access_token=access-token-value&lightning_out_app_id=app-id"
    }
)
    .then((response) => {
        console.log("Status:", response.status);
        return response.json();
    })
    .then((data) => {
        console.log("Success:", data);
    })
    .catch((error) => {
        console.error("Error:", error);
    });

成功すると、UI Bridge API はフロントドア URL を含む JSON 応答を返します。

HTTP/1.1 200 OK

Content-Type: application/json
Cache-Control: no-cache,must-revalidate,max-age=0,no-store,private
....

{"frontdoor_uri":"https://MyDomainName.my.salesforce.com/secur/frontdoor.jsp?otp=otp_value"}

失敗した場合、API はエラーメッセージを返します。エラーメッセージの説明は、「UI セッションにブリッジするためのフロントドア URL の生成」を参照してください。

フロントドア URL が返されたら、lightning-out-application コンポーネントの frontdoor-url 属性を frontdoor_uri 値に設定します。frontdoor-url 属性値は、JSON 応答全体ではなく URL のみの文字列にしてください。

ヒント lightning-out-application コンポーネント定義を含め、Lighting Out 2.0 アプリケーションを構成する HTML 要素を確認するには、「Understand Lightning Out 2.0 Architecture (Lightning Out 2.0 アーキテクチャについて)」を参照してください。

frontdoor-url 属性を設定すると、Lightning Web Runtime アプリケーションが読み込まれ、有効な Salesforce セッション ID が設定されます。 これで、Lightning Out 2.0 アプリケーションが外部ホストページに読み込まれます。

標準 UI Bridge API エンドポイントからのフロントドア URL の取得

Lightning Out 2.0 UI Bridge API エンドポイントを使用する代わりに、標準の UI Bridge API エンドポイントservices/oauth2/singleaccessから前面ドア URL を取得できます。この方法では、外部アプリケーションに独自のサーバー側認証フローを設定する必要があります。ただし、この方法を使用すると、会社に特定のセキュリティ要件がある場合により詳細な制御が可能になります。

メモ Lightning Out 2.0 エンドポイントとは異なり、標準 UI Bridge API エンドポイントでは、Salesforce の [設定] で設定された CORS 設定はサポートされません。

手順は、「UI セッションにブリッジするためのフロントドア URL の生成」を参照してください。要求に redirect_uri パラメータを含めないでください。Salesforce ホームページに移動する代わりに、外部ホストページに Lightning Out 2.0 アプリケーションコンポーネントが表示されます。

フロントドア URL が返されたら、lightning-out-application コンポーネントの frontdoor-url 属性を frontdoor_uri 値に設定します。frontdoor-url 属性値は、JSON 応答全体ではなく URL のみの文字列にしてください。

frontdoor-url 属性を設定すると、Lightning Web Runtime アプリケーションが読み込まれ、有効な Salesforce セッション ID が設定されます。 これで、Lightning Out 2.0 アプリケーションが外部ホストページに読み込まれます。