Salesforce Chat 配置

Salesforce Chat 配置

[TOC]

Salesforce Chat 就是早期的Salesforce Live Agent，用於Service Cloud的在線客服模塊，一般配合Omni-Channel模塊來實現在線聊天功能

前置條件

• 需要Service Cloud 的許可證
• 如果使用Live Chat，需要Digital Engagement，或者是UE 版本的Service Cloud

配置

Chat的配置都在設置==>聊天中

​

1. 聊天設置

啓用在線聊天功能，SF自動生成對應的聊天API信息，不需要修改；

2. 聊天客服人員配置

主要是設置客服人員界面功能

• 基本信息：如預覽功能啓用：當客戶在文本框中輸入內容時，客服能實時查看，歡迎用語與客服名稱
• 管理者設置：客服主管相關的設置，如耳語功能，主管對客服的協助等
• 聊天轉移相關的設置，如：聊天轉移給其它人員

​

3. 聊天按鈕 & 邀請

設置聊天按鈕或者邀請，聊天按鈕設置好後，可以放到任意網頁界面，比如官網，community 等；

配置好路由信息，如選擇全方位，技能等，及每個客服人員同時能接入幾個聊天

​

4. 部署

創建部署後，會自動生成對應的腳本

​

5. 嵌入服務

嵌入服務是整合聊天代碼與設置，統成輸出一段代碼，將該代碼貼到對應的網站，就能直接在線聊天了

在嵌入服務中，點新建，選擇嵌入聊天，填寫基本信息，選擇site

​

• 聊天設置：

  • 選擇前面配置的聊天按鈕與部署，保存後，再設置聊天前與品牌化
  • 聊天前表單：綁定表單對應的對象，如個案，設置用戶點聊天按鈕後彈出的窗口的表單的字段 ​

• 離線支持：啓用後，如果沒有坐席在線，則會提示用戶，讓用戶填寫表單後，直接生成個案

• 其他品牌化：針對聊天窗口做設置，比如聊天頭像，聊天背景等，可以結合網站的樣式，聊天窗口做統一的樣式調整

  • 標籤一欄：針對窗口中的元素做翻譯

• 使用 Lightning 組件自定義：

  • 這裏主要是針對聊天組件開放自定義，聊天頁頭，聊天文本，最小化，聊天前

    聊天前表單自定義時，比如：當用戶點在線聊天，先給用戶展示常見問題列表，然後才發起聊天

​ 當所有個性化設置完成後，點獲取代碼按鈕，得到在線聊天的代碼，將代碼粘到對應的網站上，即可

6. 測試

• 在站點中，創建一個WebChat VF頁面來模擬官網，將代碼貼到VF中，在站點簡檔中，將WebChat VF頁面加入公開訪問中

• CORS：將域名加入，處理跨域問題

  訪問VF頁面，在右下角點聊天按鈕，彈出對應表單：

  ​

客服的聊天界面，針對客服的界面，可以做設置，比如一側顯示個案與聯繫人，另一側顯示知識庫，將得到相關的信息，快速更新到個案或者聯繫人字段上

補充：

• 快速文本功能：這個功能對客服比較實用，可以將一些固定語句，提交錄入系統，在使用時，點擊插入，快速插入文本，也可以在電子郵件中使用

• 聊天轉移：選擇聊天隊列、用戶或轉移此聊天的技能

  ​

• 文件：在線聊天支持用戶上傳文件，但操作上有點不太方便，客服請求上傳文件，選擇將文件上傳到那個記錄上，用戶端會有個上傳文件的圖標，點擊上傳文件

  ​

• 關於聊天代碼，聊天代碼有許多屬性開放給開發者修改，具體看對應文檔Customizable Parameters in the Embedded Chat Code

  var initESW = function(gslbBaseURL) {
              embedded_svc.settings.displayHelpButton = true; //或爲假
              embedded_svc.settings.language = 'zh-cn'; //例如，輸入 'en' 或 'en-US'
  
              //embedded_svc.settings.defaultMinimizedText = '...'; //（默認設置爲與專家聊天）
              //embedded_svc.settings.disabledMinimizedText = '...'; //（默認設置爲客服人員離線）
  
              //embedded_svc.settings.loadingText = ''; //（默認設置爲正在加載）
              //embedded_svc.settings.storageDomain = 'yourdomain.com'; //（爲部署設置域，這樣訪客可在聊天會話期間導航子域。）
  
              // 聊天 的設置
              //embedded_svc.settings.directToButtonRouting = function(prechatFormData) {
              // Dynamically changes the button ID based on what the visitor enters in the pre-chat form.
              // Returns a valid button ID.
              //};
              //embedded_svc.settings.prepopulatedPrechatFields = {}; //設置自動填充聊天前表單格字段
              //embedded_svc.settings.fallbackRouting = []; //按鈕 ID、用戶 ID 或 userId_buttonId 的數組
              //embedded_svc.settings.offlineSupportMinimizedText = '...'; //（默認設置爲聯繫我們）
  
              embedded_svc.settings.enabledFeatures = ['LiveAgent'];
              embedded_svc.settings.entryFeature = 'LiveAgent';
  
  

• 針對聊天前表單自定義組件代碼參考官方示例，在基礎上修改

  Lightning Web Components for Embedded Service for Web

• 目前瞭解下來：針對聊天前表單界面，嵌入服務設置中是提供Lightning 組件重寫，那針對聊天后，常見的場景是，滿意度調查，比如本次服務打分等操作，查資料，在聊天按鈕裏可以設置聊天后頁面，只能選擇VF頁面，在聊天按鈕裏也可以設置聊天表單界面，也只能選擇VF頁面，或者託管聊天頁面的URL，另聊天按鈕中生成的JS 代碼也可以放到任意網頁中，只不過需要自己處理相關按鈕，而用嵌入服務，則SF直接生成好代碼，只需要微調就能直接使用；

  ​

以下爲聊天后VF頁面，能獲取到聊天相關的信息，通過這一途徑可以解決聊天后滿意度調查的問題

<apex:page id="afterafterchatchat">
        <div id='details'>
            <!-- This will present all the post chat parameters available to this page -->
            <h1>Post Chat Page</h1>
            <p>
                <!-- These variables are passed to the post-chat page and can be used to customize your post-chat experience -->
                Request Time:  <apex:outputText id="c_rt" value="{!$CurrentPage.parameters.requestTime}" /><br/>
                Start Time:  <apex:outputText id="c_st" value="{!$CurrentPage.parameters.startTime}" /><br/>
                Deployment Id: <apex:outputText value="{!$CurrentPage.parameters.deploymentId}" /><br/>
                Button Id: <apex:outputText value="{!$CurrentPage.parameters.buttonId}" /><br/>
                Chat Key: <apex:outputText value="{!$CurrentPage.parameters.chatKey}" /><br />
                Last Visited Page: <apex:outputText value="{!$CurrentPage.parameters.lastVisitedPage}" /><br/>
                Original Referrer: <apex:outputText value="{!$CurrentPage.parameters.originalReferrer}" /><br/>
                <!-- When the GeoLocation is not available this will appear as Unknown -->
                Latitude: <apex:outputText value="{!$CurrentPage.parameters.latitude}" /><br/>
                Longitude: <apex:outputText value="{!$CurrentPage.parameters.longitude}" /><br/>
                City: <apex:outputText value="{!$CurrentPage.parameters.city}" /><br/>
                Region: <apex:outputText value="{!$CurrentPage.parameters.region}" /><br/>
                Country: <apex:outputText value="{!$CurrentPage.parameters.country}" /><br/>
                <!-- End of GeoLocation information -->
                Organization: <apex:outputText value="{!$CurrentPage.parameters.organization}" /><br/>
                Disconnected By: <apex:outputText value="{!$CurrentPage.parameters.disconnectedBy}" /><br/>
                Window Language: <apex:outputText value="{!$CurrentPage.parameters.windowLanguage}" /><br/>
                Chat Details: <apex:outputText value="{!$CurrentPage.parameters.chatDetails}" /><br />
                Transcript: <apex:outputText value="{!$CurrentPage.parameters.transcript}" /><br/>
                Attached Records : <apex:outputText value="{!$CurrentPage.parameters.attachedRecords}" /><br />
                Error: <apex:outputText value="{!$CurrentPage.parameters.error}" /><br />
            </p>
        </div>
        <hr/>
        <!-- Message to show if chat is abandoned -->
        <div id='abandoned' style='display: none;'>
            We are sorry you decided to leave the chat. Feel free to initiate a new session.
        </div>
        <!-- Code to decide if we show the abandoned block or the full data -->
        <script type='text/javascript'>
            var requestTime = '{!$CurrentPage.parameters.requestTime}';
            var startTime = '{!$CurrentPage.parameters.startTime}';
            // when startTime doesn't have a value, it means the chat never started
            if (!startTime) {
                document.getElementById('details').style.display = 'none';
                document.getElementById('abandoned').style.display = 'block';
            }
        </script>

</apex:page>

• 使用體驗
  • 通過Service Cloud的可以快速搭建在線聊天，滿足基本的聊天需求，國內使用，在點聊天按鈕時，需要加載較長時間，這點也諮詢過相關人員，回覆，是由於要加載大量的腳本，所以會有點慢
  • 跟國內電商的在線聊天體驗感相差大，客戶會提出，能不能像某東那樣的功能，我在那個頁面，當點在線聊天時，把用戶當前訪問頁面或者商品發送到聊天中