.net core 和 WPF 開發升訊威線上客服與營銷系統:背景和產品介紹

sheng.chao發表於2020-12-14

本系列文章詳細介紹使用 .net core 和 WPF 開發 升訊威線上客服與營銷系統 的過程。本產品已經成熟穩定並投入商用。
線上演示環境:https://kf-m.shengxunwei.com 注意:演示環境僅供演示交流與評估,不保證 7x24 小時可用。

文章目錄列表請點選這裡


這個系列的文章,是用來填我2015年挖的一個坑。2015年6月我發表過一篇文章“使用 WPF+ ASP.NET MVC 開發 線上客服系統(一)”,介紹了當時自己開發的客服系統概況,雖然當時系統的開發完成度已經很高,但因為工作等原因,後續的開發完善擱置了,文章也擱置了。直到後來 .net core 關注度的持續升溫,我也有了想抽空把系統撿起來,用 .net core 重構並好好完善使之能夠完全產品化的想法。

最近一段時間我慢慢完成了系統的重構和開發工作,使用 .net core 徹底重寫了整個後端,WPF 的客服端也經過了一定的優化和改善。工作小小告一段落,這個系列的文章也到了填坑的時候,時隔了五年,系統的設計和開發細節早已和當初有了很大不同,這次我將重頭開始,從系統的功能設計、技術架構、開發細節以及各個功能,詳細介紹開發實現的過程。在未來的系統開發和完善過程中,如果時間允許,我也會同步更新這一系列的文章進行介紹。

作為首篇文章,本文對產品的背景和功能做簡單的介紹。

2015年前後當時開發的初版,我使用了 ASP.NET MVC 做為後端,資料庫使用原生 ADO.NET 進行操作、WPF 做客服端,Web 訪客端使用原生 JavaScript 開發。為了使整個系統能夠向下相容,客服端 .net 框架使用的是 .net framework 3.5 ,可以相容 Windows XP SP2,Web 訪客端為了相容 IE6 ,也使用了許多比較麻煩的技術實現,說來話長,這次不展開說這方面的細節。

在這次重構的新版本放棄了對 Windows XP 和 IE6 的支援,後端使用 .net core 3.1 ,資料庫操作使用了 entity framework core。客服端依然是 WPF,基礎框架升級到了 .net framework 4.8 ,訪客端依然是原生 JavaScript,相容 IE8 以上瀏覽器。

另外相對於2015年的版本,這次重構我增加了一個 Web 後臺,使用 Vue 實現,把原先放在客服端的一些管理功能,改到了 Web 後臺中,例如:組織機構管理、客服管理、角色許可權管理、多站點管理等。
此外因為有了 Web 後臺,這次有興趣的朋友就可以自行註冊體驗了,當年的舊版本需要我手工開通,很是麻煩。

線上演示環境:https://kf-m.shengxunwei.com 注意:演示環境僅供演示交流與評估,不保證 7x24 小時可用。

以上所有設計開發工作都是我自己一個人利用業餘時間完成的,從系統後臺,到 WPF 客服端、Web 前端、Web 管理端,用了很多的時間。功能更新補充的速度不會很快,因為精力實在有限,而且由於系統使用場景的特殊性,始終把穩定性放在第一位,在這方面也花了很多時間。


這個系列的文章主要圍繞產品設計和技術開發兩方面來講,本文作為第一篇,介紹完背景,下面簡單介紹一下目前實現的功能。

客服功能:

  1. 訪客來訪提醒
    當有訪客到達網站時,訪客端會即時彈出提醒視窗,客服可以快速瞭解訪客的地域、來源、關鍵詞、來訪次數、歷史對話次數及其進入瀏覽的網頁。
  2. 訪客型別識別
    系統自動識別訪客來源渠道(PC、手機、微信),自動識別新舊訪客以及網站會員使用者功能,便於訪客管理,提高服務效率。
  3. 訪客來源跟蹤
    客服可以瞭解訪客的所在地域、來源、關鍵詞、來訪次數、歷史對話次數及瀏覽的網頁。
  4. 訪客訊息預知
    通過訊息預知功能,客服人員可提早一步瞭解訪客正在輸入的內容,瞭解訪客的需求及想法,方便客服人員能更快速、更詳細的為訪客服務,提高工作效率和質量。
  5. 線上圖文會話
    客服和訪客雙方對話視窗都提供多樣式對話體驗,文字對話為主,檔案傳送、表情、連結為輔。支援客服人員和網站訪客雙向檔案傳輸功能。
  6. 常用語/常用檔案
    可對客服使用的常用訊息、常用連結、常用檔案進行管理和維護,便於客服在交談時直接呼叫此類檔案進行快捷回覆。
  7. 轉接客服
    當客服人員在遇到解決不了的問題,客服人員可將該對話訪客轉接給其他客服人員,為企業線上諮詢提供了便捷性。
  8. 遮蔽惡意訪客
    客服人員通過它可對惡意騷擾的訪客進行遮蔽,使客服不再受到此類訪客的騷擾。
  9. 會話歷史記錄
    客服人員可以查詢會話歷史記錄,支援根據時間段和關鍵詞查詢。
  10. 實時監控
    有許可權的管理人員可以實時監控所有客服的實時聊天內容和狀態。

訪客功能:

  1. 網頁即時通訊
    訪客無需安裝外掛即可發起諮詢,訪客可隨時通過個人電腦、手機、平板等裝置進行線上商務溝通,方便快捷。
  2. 邀請視窗
    企業可以融合網站風格、形象定位、使用者特點等因素,自主設定個性化、特色的邀請視窗樣式。
  3. 諮詢圖示
    在網站上顯示一個浮動的諮詢圖示,支援自定義風格主題。
  4. 訪客對話視窗
    訪客對話視窗可設定多種顏色風格,視窗標題、客服資料、歡迎語、公司名片、公告。
  5. 線上圖文會話
    客服和訪客雙方對話視窗都提供多樣式對話體驗,文字對話為主,檔案傳送、表情、連結為輔。支援客服人員和網站訪客雙向檔案傳輸功能。
  6. 直接對話視窗
    客服可對線上訪客發起主動對話。

實現效果截圖:

訪客端

左下角的浮動圖示,可以根據是否有客服線上顯示不同的圖片,當沒有客服線上時,將引導訪客進入留言頁面。
右下角的區域可以展開,直接在網站上邊瀏覽邊交流,不用開啟新的瀏覽器視窗。

訪客也可以開啟單獨的瀏覽器視窗進行交流。

客服端

主介面

客服端介面目前初步的設計分為三大區域:

  • 左邊是會話區,根據訪客的不同狀態在樹型結構中顯示。
  • 中間是會話區,除了聊天會話相關的功能之外,還能顯示出訪客的基本資訊。
  • 右側為輔助功能區,能夠顯示訪客的瀏覽訪問網站時的軌跡,過去的聊天曆史記錄;以及客服的快捷回覆列表等。
    未來的完善也將圍繞著三大功能區進行設計。

歷史記錄

能夠根據單次會話記錄,聯動顯示前後同一訪客的所有會話記錄。左側藍色為查詢區,滑鼠指上去會自動滑出顯示查詢條件,不過這個設計似乎不是太友好,有待改進。

站點引數

站點引數目前實現的功能比較細,能夠對訪客端的各種細節進行精確的配置。

個人設定

登入客服自己的一些個性化配置,都放在這裡,目前還有待完善。

Web 後臺

站點管理

系統支援多站點功能。一個機構可以擁有多個站點,站點和客服的關係是平行的,不是隸屬的。客服可以根據許可權配置,登入一個或多個站點。

組織機構、客服、角色許可權

曹旭升
QQ:279060597
原文:[https://blog.shengxunwei.com/Home/Post/9b667212-565c-43a8-8379-bd0b832a3720]

相關文章