埋め込み可能なBox Hubs AIチャットでは、Hubあたり最大20,000ファイルに基づいてインテリジェントなインサイトが提供されます。このiframe要素をSalesforceのようなカスタムアプリやカスタムポータルに直接埋め込むことにより、エンドユーザーは、質問を送信して、高度なAIが生成した回答を気を散らすことなく取得し、OpenAI、Google、Anthropicなどのプロバイダが提供する高度なLLMを活用できます。
このアプローチは、カスタムRAGシステムの構築や保守、ベクトルデータベースへのコンテンツの保存といった複雑さを伴うことなく、自社のナレッジベースを理解した知識豊富なアシスタントをアプリに提供するものと考えてください。
このガイドに従えば、短い簡単な手順で、Box Hubs AIチャット、Visualforce、Lightningアプリケーションビルダーを使用してSalesforceに埋め込まれたRAGソリューションが完成します。
例として、Salesforceで顧客関係を管理するAcme社の営業担当者を考えてみましょう。取引先ページにBox Hubs AIチャットが埋め込まれている場合、「第2四半期にはどのようなマーケティングキャンペーンが計画されていますか?」や「次の四半期にどのような顧客向けのイベントを開催する予定ですか?」といった質問をすることができます。AIは、会社のBox Hubに保存されているマーケティングプラン、キャンペーンの簡単な説明、イベントドキュメントに基づき即座に回答を提供します。これらはすべて、Salesforceの取引先レコード内で行われます。
このユースケースは、Boxに保存されている顧客関連データと商談関連データを緊密に統合し、より多くのコンテキストに基づくインサイトを活用することで、さらに拡張できることを念頭に置いてください。
Box Hubs AIチャットの概要
Box Hubs AIチャットは、特定のBox Hub内のデータを使用した埋め込み可能なUI機能です。ナビゲーションやファイルの参照を含むBox Hub全体の埋め込みとは異なり、AIチャットでは、コンテンツ参照の必要がなくなり、組織のドキュメントから数秒で文脈に応じた回答を提供します。
このアプローチは、以下のようなユースケースに最適です。
- セールスインテリジェンス: 顧客対応の電話中に、商談ページから直接、競争力の高いバトルカード、製品仕様、価格ドキュメントを照会できます。
- サポートの知識: ケースページからトラブルシューティングガイドや技術ドキュメントにアクセスし、サポートに関する複雑な質問に対する回答を即座に取得できます。
- 取引先の背景: 取引先ページから会議記録、契約書、プロジェクトドキュメントを照会し、顧客対応前にすばやく背景を把握できます。
- 製品情報: カスタム製品オブジェクトに埋め込まれた仕様、ロードマップ、調査ドキュメントにアクセスし、即座に機能やタイムラインに関する質問に回答できます。
- マーケティングのインサイト: 計画中のメールやソーシャルメディアキャンペーン、顧客向けイベント、カンファレンスに関する回答を得られます。
このソリューションには、さまざまなプロバイダが提供するLLMや高度な思考モデルを含むAIモデルのドロップダウンも用意されています。これには、チャットウィジェット全体、またはクリックして開くチャットボタンという2つの埋め込みモードがあります。
チャットボタンモード
チャットボタンモードの場合、クリックするとチャットインターフェースが開くフローティングボタンがページに追加されます。チャットを利用可能にしたいものの常に表示しておきたくないアプリケーションに最適です。
チャットウィジェットモード
チャットウィジェットモードの場合、iframeを使ってページ上に直接チャットインターフェース全体が埋め込まれ、ページ読み込み時にすぐに表示されます。専用のヘルプページやサポートページ、ナレッジベースのインターフェース、または常にパネルが表示されているダッシュボードレイアウトに最適です。
このチュートリアルでは、短い簡単な手順でSalesforce Lightning Experienceにチャットウィジェットを埋め込む方法を重点的に説明します。このガイドを完了するのにコーディングの経験は必要ありません。
前提条件
統合の利用を開始する前に、以下を準備できていることを確認してください。
Boxの要件
- Box AI for Hubsが企業レベルで有効になっていること
- 少なくとも、埋め込む予定のHubに対してビューアー権限があること
- (招待メールにより) Box Hubのコラボレータとして追加されたBox HubまたはSalesforceのユーザーに共有リンクを生成できること
Salesforce
- Lightning Experienceが有効になっていること
- Visualforceページを作成する権限で [Setup (設定)] にアクセスできること
- システム管理者権限またはアプリケーションのカスタマイズ権限
概要
この統合では主に4つの手順が必要です。
- Box Hubを準備し、生成されたiframeコードをコピーする。
- AIチャットのiframeを使用してVisualforceページを作成する。
- Salesforceのセキュリティ設定を構成する。
- Lightningレコードページにコンポーネントを追加する。
手順1: Box Hubの埋め込みコードを生成する
最初に、Boxでiframeコードを生成します。
Box Hubに移動し、右上にある省略記号メニューをクリックします。ドロップダウンメニューから [埋め込む] を選択します。
埋め込みウィンドウで、[Hub AIチャット] タブを選択します。[チャットボタン] と [チャットウィジェット] という2つの埋め込みオプションが表示されます。このSalesforce統合では、[チャットウィジェット] モードを選択します。これにより、ページに直接、チャットインターフェース全体が表示されます。サイズは、必要に応じて、カスタムサイズ (ピクセル単位) で変更できます。
Boxにより、Hubの埋め込みURLを含むiframeコードスニペットが生成されます。このコードは、次の手順でVisualforceページを作成する際に使用するため、コピーしてください。
スニペットの例を以下に示します
ユーザーのアクセス権限の管理
ユーザーがAIチャットを操作するには、Box HubおよびHubsのBox AI機能へのアクセス権限が必要です。Hubにアクセスできるユーザーを明示的に制御する場合は、srcのURLからsharedLinkパラメータを削除し、Hub画面右上の [共有] ボタンをクリックしてSalesforceユーザーをコラボレータとして追加してください。これにより、チームメンバーのメールアドレスがコラボレータとして追加され、適切な権限レベルが割り当てられます。AIチャット機能には、ビューアーのアクセス権限で十分です。
代替手段: Box for Salesforce統合 (認証済みアクセス) の使用
より高度なセキュリティ機能を必要とする組織向けに、AppExchangeの公式のBox for Salesforce統合では、シームレスなシングルサインオンおよびネイティブのLightningコンポーネントによる認証済みアクセスを提供しています。この方法では、Box for SalesforceパッケージのインストールとBoxサービスアカウントの設定が必要になりますが、フォルダ作成の自動化、Box Signとの連携、きめ細かい権限管理などのエンタープライズグレードの機能が提供されます。
手順2: Visualforceページを作成する
Salesforceで、Box Hubs AIチャットインターフェースを埋め込むVisualforceページを作成します。
右上の歯車アイコンをクリックし、[Open Advanced Setup (詳細設定を開く)] を選択して、詳細設定に移動します。新しいブラウザウィンドウが開きます。
左側の [Quick Find (クイック検索)] ボックスでVisualforce Pages (Visualforceページ) を検索し、結果から選択します。[New (新規)] をクリックして、新しいVisualforceページを作成します。
ページの詳細を設定し、[Available for Lightning Experience, Experience Builder sites, and the mobile app (Lightning Experience、エクスペリエンスビルダーサイト、およびモバイルアプリケーションで利用可能)] チェックボックスがオンになっていることを確認します。これは、Lightningページの設定からこのコンポーネントにアクセスできるようにするための重要な手順です。
[Visualforce Markup ] セクションで、以下のコード構造を貼り付け、srcの値をBox Hubインターフェースで生成されたリンクに置き換えます。ページのサイズは、幅や高さを調整して更新することもできます。
⚠️ HUB_IDとYOUR_SHARED_LINK_HASHは、Box Hubの埋め込みコードの実際の値に置き換えてください。
[Save (保存)] をクリックし、プレビューモードでAIチャットが動作することを確認します。
手順3: Salesforceのセキュリティ設定を構成する
Salesforceは、信頼済みURLを通じて外部コンテンツをiframeに読み込むために明示的な許可を必要とします。したがって、Box Hubs AIチャットをSalesforceページ内に表示するには、あらかじめBoxをホワイトリストに登録しておく必要があります。
[Advanced Setup (詳細設定)] に移動し、[Quick Find (クイック検索)] ボックスで信頼済みURLを検索します。[New Trusted URL (新規信頼済みURL)] をクリックし、以下を設定します。
- 信頼済みサイト名: Box
- 信頼済みサイトURL: https://app.box.com
- 有効: チェック
- ディレクティブ: 利用可能なすべてのコンテキストを選択:
- connect-src (APIコールを有効にする)
- frame-src (iframeの埋め込みを有効にする)
- img-src (画像を有効にする)
- script-src (JavaScriptを有効にする)
- style-src (CSSによるスタイル設定を有効にする)
上記が完了したら、[Save (保存)] をクリックします。
手順4: LightningページにAIチャットコンポーネントを追加する
最後に、Box Hubs AIチャットを含むVisualforceページをLightningページに追加する必要があります。
そのためには、[Quick Find (クイック検索)] の検索バーでLightning App Builder (Lightningアプリケーションビルダー) を検索します。そのコンポーネントを追加するページを選択します。この例では、[Account Record Page (取引先レコードページ)] を編集します。このレコードをクリックし、[Lightning Page Detail (Lightningページの詳細)] で [Edit (編集)] をクリックします。同じブラウザウィンドウ内に新しいエディタ画面が表示されます。
AIチャットを追加するスロットを選択し、左側のパネルから [Visualforce] を選択します。右側のパネルにある [Visualforce Page Name (Visualforceのページ名)] でコンポーネントを選択します。前述の手順で定義したチャットサイズに合わせて高さを変更することもできます。準備ができたら、[Save (保存)] をクリックします。
まとめ
Box Hubs AIチャットをSalesforceに埋め込むことにより、ユーザーがワークフローから離れることなくAIを活用したドキュメントインテリジェンスを利用できるシームレスなエクスペリエンスを実現しました。この統合は、組織のナレッジをよりアクセスしやすく、実用的なものにするための確実な前進を示しています。
Box Developer Forumで、このエクスペリエンスに関する皆さまからのフィードバック (英語のみ) をお待ちしております。
その他のリソース
Box開発者向けブログ — Salesforce統合に関するシリーズ
BoxとSalesforceの連携によるさらなる可能性を探りたい方は、Box開発者向けブログやこの分野に特化した記事をご確認ください。