Salesforce ConsoleをToolkitでカスタマイズ - TECH BLOG

はじめに

みなさんはじめまして。早速ですが、みなさんはSalesforce Consoleはどのくらい使用したことがありますか？少し以前ではService(Sales) Cloud Consoleと呼ばれていましたが、バージョンアップを重ね現在はSaleseforce Console(for Service・for Sales)と呼ばれるようになりました。コンソールについて詳しくは過去の記事やヘルプをご参照ください。

さて、一画面に情報を集約して効率化を図れるコンソールですが、コンソールの標準機能とは別に必要な機能が出てきた時、Visualforce等での開発を行うこともあります。しかし標準画面での操作とは違い、Visualforce画面をコンソール上に表示した場合、コンソールの標準機能が動作しない場合があります。例えば、標準画面では主タブに対してサブタブで関連するレコードを作成した場合、保存処理にあわせて主タブ全体がリフレッシュされ、変更が反映されるようになっていますが、Visualforceでレコードを保存した場合はリフレッシュがかかりません。また標準機能の利用以外にも、主タブやサブタブの開閉やサイドバーやフッターからのタブへのアクセスなど、プログラムにより制御や自動化ができるようになれば、より自由にコンソールを使用することができます。

そこで、今回はコンソールへの開発をサポートするSalesforce Console Integration Toolkitについて紹介します。

Toolkitについて

Salesforce Console Integration ToolkitはJavascript APIとして提供され、ライブラリを読み込むことで使用できます。 Toolkitを参照するためには以下のようにscriptファイルのURLを指定します。

相対パス：

絶対パス：

Visualforceで使用する場合には、相対パスで指定することができますが、そうでない場合は組織のインスタンスのドメインもしくはデフォルトのインスタンスドメインを含めた絶対パスで指定します。サンプルではデフォルトのインスタンスを指定しています。また、注意点として外部のドメインからToolkitを使用するには、コンソールのホワイトリストに外部ドメインを追加する必要があります。それでは、Toolkitでどのようなことができるのか見て行きましょう。

1. 主タブ・サブタブ

タブIDを取得する
タブを開く
タブを閉じる
タブにフォーカスする
タブタイトルやスタイルの指定
コンソール使用有無

コンソールの最も特徴的な機能である、タブ表示に関して操作することができます。また、今現在そのページがコンソール内で開かれているのかを判断するメソッドも用意されています。

2. カスタムコンソールコンポーネント

コンポーネント表示状態の取得
コンポーネント・ボタン表示方法の制御
コンポーネントのスタイル設定

コンソールではカスタムコンソールコンポーネントを作成してフッターに表示が可能です。作成したコンポーネントで自分自身の操作や他のタブの操作が行えます。

3. イベントリスナー

タブの開閉
ログアウト

コンソールにおけるイベント時に行う処理を指定できます。ログアウトを遅延して独自の処理を行うこともできます。

4. その他

CTIの操作
ナビゲーションタブの操作
転送通知の取得
LiveAgentの操作
オムニチャネルの操作

ソフトフォンへのアクセスやチャットのイベント制御など、各種コンソールの機能にアクセス可能です。

※非同期処理 注意点として、各メソッドは基本的に非同期での実行となっているため、コールバック関数を指定し、適切なコールバック処理を行う必要があります。

いかがでしょう、Toolkitを使用して行えることのイメージはついてきましたか？ Toolkitを使用すればコンソールの標準で提供されている機能にアクセスすることができるため、コンソールの状態やイベントを取得→開発機能による処理→必要に応じてコンソールの状態を更新といった流れで機能の実装が可能です。

実例

それでは、実際にToolkitを使用してみましょう。今回は、先ほど挙げたリフレッシュと、Visualforceページをタブに表示した際のタブ名「外部ページ」の上書きを行います。以下の想定で作成していきます。

１．ヘッダと明細形式のデータを扱う
２．明細をサブタブで登録した際に、主タブをリフレッシュする
３．リフレッシュ完了後は主タブに戻るため、サブタブを閉じる

まずは、明細の編集画面です。

保存ボタンの処理は拡張クラスで行っており、保存に必要な処理を実装しています。この画面で明細編集画面を上書くのですが、この際ページをコンソールで開くとタブ名が外部ページになります。

このタブ名を以下のスクリプトで変更します。

次に、はじめのページでボタンのoncompleteに指定していたメソッドをScriptに追加します。

ここでは、現在フォーカスしている主タブのIDを取得しています。タブのIDは引数に指定したコールバック関数へと渡されます。そのコールバック関数は以下のようになります。

指定したIDでタブのリフレッシュが成功したかはコールバック関数に渡されます。

リフレッシュ結果を受け取って処理を分岐し、成功していれば自身のサブタブを閉じることとします。この時、自身のタブはgetEnclosingTabIdメソッドで取得可能です。 IDの取得結果は例によってコールバック関数で受け取ることとなるので、以下のコールバック関数を追加します。

これでタブのクローズまで完了しました。ページは以下のようになりました。

最後に

Salesforce Console Integration Toolkitにはまだまだ紹介できていない機能がたくさんあります。ホワイトリストを適切に設定すれば、外部のWebページやアプリケーションからToolkitを使用してコンソール上で処理を行うことも可能ですし、コンソール内のタブはそれぞれiframeで読み込まれますので、Toolkit同様Javascriptで操作するのも面白いですね。

今年のDreamforceも開催が間近となっており盛り上がってきていますね。 Salesforce Consoleも毎年のように機能が追加されており、どんどんできることが増えていっています。そんなSalesforce Consoleをよりよくするため、Salesforce Console Integration Toolkitを使用してコンソールアプリケーションを構築してみてはいかがでしょうか。