Loading
ただいま大変多くのお問い合わせをいただいており、ご連絡までにお時間を頂戴しております続きを読む
Salesforce Scheduler での予定の管理
Lightning Out を使用した Web サイトへの [受信 新規ゲスト予定] フローの追加

Lightning Out を使用した Web サイトへの [受信 新規ゲスト予定] フローの追加

未認証のユーザーに [受信 新規ゲスト予定] フローへのアクセス権を付与する会社の Web サイト (外部 Web サイト) に Lightning Out 連動関係アプリケーションを追加します。

必要なエディション

使用可能なインターフェース: Lightning Experience。
使用可能なエディション: Enterprise Edition および Unlimited Edition

ゲストユーザーに必要なユーザー権限とオブジェクト権限が付与されていることを確認します。詳細は、「ゲストユーザーへの必要なユーザー権限およびオブジェクト権限の付与」および「予定をスケジュールするゲストユーザーの共有ルールの作成」を参照してください。

メモ
メモ Scheduler フローが外部 Web サイトでホストされている場合、フローでは、ゲストユーザープロファイルで設定されている言語ではなくブラウザーで設定されている言語を使用します。
  1. [受信 新規ゲスト予定] 標準フローテンプレートのコピーを作成します。
  2. UI 要素が正確に配置されるように、次の <style> タグを Web ページに追加します。
    <style>
            .slds-visual-picker_vertical .slds-visual-picker__figure {
                height: inherit !important;
            }
    
            .runtime_appointmentbookingFlowLocation .slds-visual-picker_vertical {
                display: inline-flex !important;
            }
    </style>
  3. JavaScript Lightning Out ライブラリへの参照を追加するには、script タグを使用します。
    1. Lightning Out JavaScript ファイルを Web ページに追加します。
      <script src="https://YourSiteDomain/lightning/lightning.out.js"></script>
    2. https://YourSiteDomain/ を Experience Cloud サイト URL に置き換えます。
      警告
      警告 script タグに SiteURL を追加すると、フローは機能しません。
  4. Web ページで LightningOutGuest アプリケーションを読み込んで有効化するには、次の手順を実行します。
    1. 標準の Lightning Out JavaScript コードを追加します。
      <script>
          $Lightning.use("runtime_appointmentbooking:lightningOutGuest",
              function() {                  // Callback once framework and app load
                  $Lightning.createComponent(
                      "lightning:flow",    // top-level component of your app
                      { },    // attributes to set on the component when created
                      "lexcontainer",    // the DOM location to insert the component
                      function(component) {            // API name of the Flow
                          component.startFlow("Salesforce_Scheduler_Unauthenticated");
                      }
                  );
              },    'https://YourSiteDomain/SiteURL/'  // Site endpoint
          );
      </script>
    2. lexcontainer を、Lightning コンポーネントを挿入するページの場所に置き換えて、別のタグから Lightning コンポーネントを呼び出します。

      Lightning コンポーネントを呼び出すサンプルコードを次に示します。

      <div id="lexcontainer">
      <p>Invoke the Lightning Component specified in the Script.</p>
      </div>
    3. https://YourSiteDomain/SiteURL を、必要なオブジェクト権限が付与された [受信 新規ゲスト予定] フローが含まれる Experience Cloud サイトの URL に置き換えます。
  5. 外部サイトのオリジン URL を CORS に追加するには、次の手順を実行します。
    1. [設定] で、[クイック検索] ボックスに「CORS」と入力して、[CORS] を選択します。
    2. [新規] をクリックします。
    3. [オリジンの URL パターン] 項目に外部サイトのオリジン URL を入力します。
    4. 変更内容を保存します。
    メモ
    メモ Scheduler フローが外部 Web サイトでホストされている場合、リソースカードにはサービスリソースの写真ではなく標準画像が表示されます。
 
読み込み中
Salesforce Help | Article