チャット

概要

この Avonni Chat コンポーネントは Lightning ページにリアルタイムメッセージングをもたらします。社内コラボレーション、顧客とのコミュニケーション、あるいはスレッド化された会話が Salesforce に価値を加えるワークフローに利用できます。


クイックスタート:2分でケースチャットを作成

コンポーネントの動作をすぐに確認したいですか? 以下の7つの手順に従い、ケースレコードページに機能するケースコメント履歴を追加します。

1

新しいコンポーネントを作成

  • を開きます Avonni Dynamic Components アプリ。

  • をクリックし 新規 ボタンを押して新しいコンポーネントを作成します。

  • 名前: 名前を入力します(例:「Case Chat History」)。

  • ターゲットページのオブジェクト: を選択 ケース.

    • 重要: ターゲットページのオブジェクト 設定は、コンポーネントがケースレコードのコンテキストで動作していることを示し、 {!RecordId} のような変数が正しく機能するようにします。

2

コンポーネントをキャンバスに追加

  • から コンポーネントライブラリ (左サイドバー)で、を検索します Chat.

  • コンポーネントをドラッグアンドドロップして Chat メインキャンバスに配置します

3

データソースの構成(クエリ) ケースコメントレコードを Salesforce から取得する必要があります。

キャンバス上で

  • コンポーネントを選択します。 Chat プロパティパネル(右)で、

  • データソース クエリ に設定します。.

  • オブジェクト: を選択 CaseComment.

  • フィルター:

    • をクリック フィルターを追加.

    • フィールド: ParentId.

    • 演算子: 等しい.

    • 値: {!$Component.RecordId}.

    • 理由:これにより、現在表示している特定のケースのコメントのみを読み込むことが保証されます。

  • 並び替え: CreatedDate ASC (古い順から新しい順)。

4

クエリフィールドのマッピング

クエリから返されるフィールドを Chat コンポーネント属性に接続します。

  • スクロールして データマッピング セクションに移動します。

  • 内容: を選択 Body.

    • 注:これはコメントの実際のテキストをメッセージバブルにマッピングします。

  • 日付: を選択 CreatedDate.

プレビューを確認: キャンバスは現在のコンテキストレコードの会話履歴を表示するはずです。プレビューが空の場合は、デバッグパネルでプレビューコンテキストがケースに設定されていることを確認してください。

5

パブリッシャーの構成

新しいメッセージ用の入力ボックスを設定します。

  • スクロールして パブリッシャー セクションに移動します。

  • モード: に設定 リッチ.

  • ボタンラベル: 「Send」を次のように変更します Post Comment.

  • プレースホルダー: を入力 返信を入力....

6

「保存」ロジックを追加(インタラクション)

「Post Comment」ボタンを機能させます。

  • をクリックし プロパティパネルの 「Interactions」

  • をクリック タブを開きます。.

    • インタラクションを追加 を選択 トリガー:.

    • メッセージ公開時 を選択 アクション:.

    • オブジェクト: を選択 CaseComment.

  • レコードデータを手動で入力

    • フィールドマッピング: ParentId: {$Component.RecordId}

    • (コメントをこのケースにリンクします)。 CommentBody: Message: Content

    • (入力したテキストをキャプチャします)。: 作成日

7

Message:Date

  • をクリック 保存して有効化.

  • 保存 を使用して このダイナミックコンポーネントを実際の Salesforce ケース Lightning ページに追加します


設定

キャンバス上で Chat コンポーネントを選択すると、プロパティパネルでそのプロパティにアクセスできます。設定では、メッセージの取得元、パブリッシャーの動作、そして新しいメッセージの処理方法を定義します。

メッセージデータへの接続(データソース)

チャット履歴は、 手動 または に設定します。 のいずれかの方法で補充できます。

オプションA:手動データソース

静的表示やプロトタイピングに使用します。

  1. データソースを選択:Manual を選択します。

  2. リソースを構成:リソースはチャットに関与する人物やエンティティを表します。

    • ラベル:表示名(ユーザー名)。

    • アバターソース:ユーザー画像の URL。

    • アバターフォールバックアイコン:画像がない場合に表示するアイコン名(例: standard:user)。

    • アバターのイニシャル:画像がない場合に表示するテキスト(例:「JD」)。

  3. メッセージを構成:特定のメッセージバブルを作成します。

    • 作成者:メッセージを送信したリソースの名前または ID。

    • タイプ:明示的に inbound (受信)または outbound (送信)として設定します。

    • 日付:メッセージのタイムスタンプ。

    • 内容:メッセージ本文の実際のテキスト。

オプションB:クエリデータソース

これを使用して Salesforce からレコードを動的に取得します(例:ケースに関連するすべてのコメントを取得)。

  1. データソースを選択: に設定します。.

  2. クエリを定義:オブジェクトを選択(例: CaseComment)し、フィルターを設定します(例: ParentId equals recordId)で正しいレコードを取得します。

  3. データマッピング:クエリのフィールドをチャット表示にマップします。

    • 内容:メッセージ本文を含むフィールドを選択します(例: CommentBody).

    • 日付:タイムスタンプを含むフィールドを選択します(例: CreatedDate).


一般設定

これらの設定は、メッセージの属性付けや表示方法など、チャットコンポーネントの全体的な動作を制御します。

設定
説明

現在のリソースID

メッセージ作成者の ID。送信(自分)か受信(他者)かの配置を決定します。空の場合は現在のユーザーがデフォルトになります。

{!$User.Id}

読み取り専用

パブリッシャーを非表示にします。ユーザーは閲覧のみ可能で送信できません

false

無効化

コンポーネントをグレーアウトし、すべての操作を防ぎます

false

メッセージ日付形式

メッセージ上にタイムスタンプをどのように表示するか

"MMM d, yyyy h:mm a" → "Jan 15, 2025 2:30 PM"


パブリッシャー設定

ユーザーが新しいメッセージを入力する入力エリアをカスタマイズします。

設定
説明

モード

メッセージ作成者の ID。送信(自分)か受信(他者)かの配置を決定します。空の場合は現在のユーザーがデフォルトになります。

{!$User.Id}

プレースホルダー

パブリッシャーを非表示にします。ユーザーは閲覧のみ可能で送信できません

false

公開ボタンラベル

コンポーネントをグレーアウトし、すべての操作を防ぎます

false

最大長

メッセージ上にタイムスタンプをどのように表示するか

"MMM d, yyyy h:mm a" → "Jan 15, 2025 2:30 PM"

最小長

送信前に必要な文字数

10

文字数カウントを表示

文字カウンターを表示します

True

ツールバーの位置

書式ツールが表示される場所

カテゴリ

リッチモードのツールバーに表示する書式グループを選択:

  • フォント:フォントファミリーとサイズのオプション。

  • テキスト:太字、斜体、下線、取り消し線。

  • Body:リスト、配置、インデント。

  • 書式の解除:選択したテキストのすべての書式をクリアします。

  • ヘッダー:見出しレベルのオプション。

  • :テキストカラーのピッカー。

  • ハイライトカラー:背景ハイライトカラーのピッカー。

ブロックワード(禁止語)

公開メッセージに含めることができない単語を定義します。ユーザーが禁止語を含むメッセージを送信しようとした場合、公開アクションは阻止されます。


リアルタイム更新(プラットフォームイベント)

デフォルトでは、Chat コンポーネントは あなたが メッセージを投稿したときに更新されます。ただし、同僚や顧客があなたが画面を見ている間に返信を投稿した場合、通常はページを更新するまでそれを確認できません。

プラットフォームイベントは これを解決します。チャットコンポーネントが変更を「リッスン」して、データベースに新しいメッセージが作成されたときに即座に更新できるようにします。

リアルタイムチャットを有効にする方法

デフォルトでは、チャットはあなたがメッセージを投稿するかページを更新したときのみ更新されます。他者からの返信が即座に表示されるライブ、「インスタントメッセージング」体験を作成するには、次を有効にできます プラットフォームイベントは.

これは次の設定で構成します: 設定:

  1. データソースをに設定 に設定します。.

  2. 展開 詳細オプション を開き、次を見つけます クエリ更新 EMP.

  3. チャネル名: プラットフォームイベントの API 名を入力します(例: Chat_Notification__e).

  4. キー項目名: レコード ID を含むフィールドの API 名を入力します(例: RecordId__c).

設定のサポートが必要ですか? この機能の使用には、Salesforce でのプラットフォームイベントとトリガーフローの作成が必要です。👉 完全なセットアップガイドを読む:リアルタイム更新の構成方法


インタラクションの構成

デフォルトでは、Chat コンポーネントはデータを表示するだけです。ユーザーが「送信」をクリックしたときに実際にメッセージを保存するなど、機能させるには インタラクションを 構成する必要があります.

シナリオ:公開時にレコードを作成する

  1. プロパティパネルの Interactions タブに移動します。 新しいインタラクションを追加し、トリガーを

  2. 「Publish a New Message」 にします。.

  3. アクション:Create Record を選択します。

  4. 選択: アクション:.

  5. オブジェクト:メッセージを保存するオブジェクトを選択します(例: CaseComment, FeedItem、あるいはカスタムの Chat_Log__c オブジェクト)。

  6. フィールドマッピング:Chat コンポーネントから Salesforce オブジェクトへデータをマップします。

    • 例(ケースコメント):

      • ParentId:にマップ {!Record.Id} (現在のレコードにリンクするため)。

      • CommentBody:Chat コンポーネント属性にマップ (これはユーザーが入力したテキストを運びます)。

      • IsPublished:定数値を設定 true.

注:インタラクションを通じてレコードが作成されると、Chat クエリ(構成されている場合)は自動的に更新され、タイムラインに新しいメッセージを表示します。


プロジェクト議論ログ

目標:カスタム「Project」オブジェクト上にチャットインターフェースを作成します。これによりプロジェクトチームは更新を議論でき、そのメッセージはカスタムの「Project Update」オブジェクトに保存されます。

1

コンポーネントを作成

  • を開きます Avonni Dynamic Components アプリ。

  • をクリック 新規.

  • 名前: 「Project Team Chat」と入力します。

  • ターゲットページ名: カスタムオブジェクトを選択します(例: Project または Project__c).

    • 理由: これは重要です。コンポーネントに対して Project レコードのコンテキストで動作していることを伝え、 {!RecordId} 変数の使用を可能にします。

2

コンポーネントをキャンバスに追加

  • から コンポーネントライブラリ (左サイドバー)で、を検索します Chat.

  • コンポーネントをドラッグアンドドロップして Chat コンポーネントをキャンバスに配置します。

3

データソースに接続

メッセージが保存されるカスタムオブジェクトをクエリする必要があります。

  • データソース: Query。

  • オブジェクト: Project_Update__c (カスタムオブジェクト)。

  • フィルター: Project__c 等しい {!RecordId}.

    • 理由: 現在の Project レコードに関連する更新のみを一覧に表示するようフィルターします。

  • 並び替え: CreatedDate ASC.

4

データをマップ

標準オブジェクトとは異なり、カスタムオブジェクトはユーザーの名前や画像が正しく表示されるよう明示的なマッピングが必要です。

  • 内容: Message_Body__c (リッチテキストエリアフィールド)

  • 日付: CreatedDate

  • 作成者名: CreatedBy.Name

  • 作成者アバター: CreatedBy.SmallPhotoUrl

    • 理由: これは更新を投稿したユーザーの Salesforce プロファイル画像を動的に取得します

5

パブリッシャーの構成

プロジェクトの進捗報告に役立つリッチな書式設定を許可するよう入力を設定します。

  • モード:リッチ

  • プレースホルダー:「プロジェクトの更新を共有…」

  • ボタンラベル:「Post Update」

  • 禁止語:(任意)必要に応じて機密の内部プロジェクトコード名を追加します。

6

「保存」ロジックを追加(インタラクション)

ボタンがクリックされたときに新しい Project_Update__c レコードを作成するようコンポーネントを構成します。

  • インタラクショントリガー:新しいメッセージを公開

  • アクション:レコードを作成

  • 選択:作成 アクション:.

  • ターゲットオブジェクト: Project_Update__c

  • フィールドマッピング:

    1. Project__c:にマップ ParentId:

      • コンテキスト: 更新を特定のプロジェクトにリンクします。

    2. Message_Body__c:にマップ CommentBody:

      • コンテキスト: 入力した内容を保存します。

    3. (入力したテキストをキャプチャします)。: メッセージ:日付

7

リアルタイム更新(オプション)

メッセージをすべてのチームメンバーに即座に表示させるには:

  1. チャネル名: Chat_Notification__e (プラットフォームイベントを作成したことを前提とします)。

  2. キー項目名: RecordId__c.


重要な考慮事項

  • データモデルの計画:クエリモードの場合、メッセージ内容、タイムスタンプ、作成者情報を保存するための必要なフィールドや、親レコードへの参照関係が Salesforce オブジェクトにあることを確認してください。

  • リソースの識別:現在のリソース ID はメッセージの配置を決定します。顧客向けの実装では、外部参加者と社内ユーザーをどのように識別するかを検討してください。

  • 文字数制限:データの切り捨てを防ぐために、ターゲットオブジェクトのフィールド制限に基づいて適切な最大長を設定してください。

  • ブロックワード(禁止語):コミュニケーション基準を維持しつつ過度に制限的にならないよう、禁止語リストを定期的に見直し更新してください。

  • パフォーマンス:履歴が膨大な会話では、最初に読み込むメッセージ数を制限するクエリフィルターを使用するか、非常に活発なスレッドではページネーション戦略を検討してください。


まとめ

Avonni Chat コンポーネントは、あなたの Lightning ページをコラボレーティブなコミュニケーションハブに変えます。社内チーム向けツールでも顧客向けインターフェースでも、柔軟なデータソース、リッチな公開オプション、実用的なインタラクションの組み合わせにより、Salesforce のデータモデルに直接統合される高度なメッセージング体験を、コードを書かずに作成できます。

最終更新

役に立ちましたか?