この文章は Salesforce 機械翻訳システムを使用して翻訳されました。詳細はこちらをご参照ください。

Open CTI を使用したサンプル HTML ページ

この例では、Open CTI を使用して CTI 機能を Salesforce ユーザインターフェースに追加する方法を示します。Salesforce 組織にコールセンター定義ファイルをすでにインポートしたことを前提としています。

HTML ページを作成します。

次のサンプルコードを切り取って HTML ページに貼り付けます。

このコードは、Open CTI の各種関数を示しています。

1swfobject.registerObject("clippy.codeblock-0", "9");
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17<html>
18<head>
19      <!-- Imports Open CTI JavaScript library. It should point to a valid Salesforce domain. -->
20      <script src="https://domain:port/support/api/25.0/interaction.js"></script>
21      <script type="text/javascript">
22             // Callback of API method: isInConsole
23             var isInConsoleCallback = function (response) {
24                  // Returns true if method is executed in Salesforce console, false otherwise.
25                  if (response.result) {
26                      alert('SoftPhone is in Salesforce console.');
27                  } else {
28                      alert('SoftPhone is not in Salesforce console.');
29                  }
30              };
31              // Invokes API method: isInConsole
32              function isInConsole() {
33                       sforce.interaction.isInConsole(isInConsoleCallback);
34              }
35              // Callback of API method: getCallCenterSettings
36              var getCallCenterSettingsCallback = function (response) {
37                     // Result returns call center settings as a JSON string.
38                     if (response.result) {
39                            alert(response.result);
40                     } else {
41                            alert('Error retrieving call center settings ' + response.error);
42                     }
43               };
44               // Invokes API method: getCallCenterSettings
45               function getCallCenterSettings() {
46                        sforce.interaction.cti.getCallCenterSettings(getCallCenterSettingsCallback);
47               }
48               // Callback of API method: setSoftphoneHeight
49               var setSoftphoneHeightCallback = function (response) {
50                        // Returns true if SoftPhone height was set successfully, false otherwise.
51               if (response.result) {
52                       alert('Setting SoftPhone height to 300px was successful.');
53               } else {
54                      alert('Setting softphone height failed.');
55               }
56               };
57               // Invokes setSoftphoneHeight API method.
58               function setSoftphoneHeight() {
59                       sforce.interaction.cti.setSoftphoneHeight(300, setSoftphoneHeightCallback);
60               }
61               // Callback of API method: getPageInfo
62               var getPageInfoCallback = function (response) {
63                      if (response.result) {
64                             alert(response.result);
65                      } else {
66                             alert('Error occured while trying to get page info: ' + response.error);
67                      }
68               }
69               // Invokes API method getPageInfo
70               function getPageInfo() {
71                       sforce.interaction.getPageInfo(getPageInfoCallback);
72               }
73      </script>
74</head>
75<body>
76      <button onclick="isInConsole();">isInConsole</button></br>
77      <button onclick="getCallCenterSettings();">getCallCenterSettings</button></br>
78      <button onclick="setSoftphoneHeight();">setSoftphoneHeight(300)</button></br>
79      <button onclick="getPageInfo();">getPageInfo</button>
80</body>
81</html>
82

上記の HTML ページを作成して URL をコールセンター定義ファイルに追加した後に、ソフトフォンが Salesforce の左側または Salesforce コンソールにカスタムコンソールコンポーネントとして表示されます。

Salesforce でのサンプル HTML ページの出力

Salesforce コンソールでのサンプル HTML ページの出力

Service Cloud コンソールでのソフトフォンとしてのサンプル HTML ページの出力

Open CTI 開発者ガイド

Open CTI を使用した サンプル HTML ページ

Open CTI を使用したサンプル HTML ページ