最近幾個(gè)月團(tuán)隊(duì)主要開發(fā)了基于websocket的網(wǎng)頁(yè)版即時(shí)聊天IM系統(tǒng)，主要滿足客服與用戶之前的溝通及問題反饋奇昙，包含消息分發(fā)护侮，通訊錄，日程储耐，任務(wù)等功能模塊羊初，保證PC在線用戶在聽課，購(gòu)買課程什湘，問題反饋等方面的咨詢和溝通及時(shí)高效的反饋到客服及專區(qū)管理員长赞。
IM即時(shí)消息分發(fā)，同時(shí)包含通訊錄闽撤，可以進(jìn)行文字得哆、語(yǔ)音、圖片哟旗、附件贩据、小視頻等聊天栋操，功能基本參照網(wǎng)頁(yè)版微信、QQ饱亮、釘釘這類的應(yīng)用矾芙，面向用戶C端更多一點(diǎn)。前端采用了web瀏覽器嵌入模式近上，后端采用了IM服務(wù)器和接口服務(wù)器架構(gòu)蠕啄，IM服務(wù)器專門負(fù)責(zé)消息的分發(fā)和推送，接口服務(wù)器負(fù)責(zé)所有業(yè)務(wù)的處理戈锻。發(fā)開要求：滿足基本業(yè)務(wù)需求歼跟，要有豐富的IM交互，開放的結(jié)構(gòu)格遭，能讓其自由接入到現(xiàn)有的Web系統(tǒng)哈街。
IM主要基于websocket通訊協(xié)議開發(fā)的，首先要弄明白WS協(xié)議的原理和機(jī)制拒迅。
WebSocket協(xié)議是基于TCP協(xié)議并遵從HTTP協(xié)議的握手規(guī)范的一種通訊協(xié)議骚秦，其通過(guò)發(fā)送連接請(qǐng)求，握手璧微，驗(yàn)證握手信息這三個(gè)步驟與服務(wù)器建立WebSocket連接作箍。
發(fā)送連接請(qǐng)求
客戶端通過(guò)一個(gè)格式為：ws://host:port/的請(qǐng)求地址發(fā)起WebSocket連接請(qǐng)求，并由JavaScript實(shí)現(xiàn)WebSocket API與服務(wù)器建立WebSocket連接前硫，其中host為服務(wù)器主機(jī)IP地址或域名胞得，port為端口。為了讓本客服系統(tǒng)能夠在不同瀏覽器建立WebSocket連接屹电，在發(fā)送連接請(qǐng)求前阶剑，需要開啟SockJS的支持，創(chuàng)建一個(gè)全雙工的信道危号。
建立websocket連接
建立連接后牧愁，可在客戶端使用JavaScript實(shí)現(xiàn)相關(guān)的WebSocket API。相關(guān)實(shí)現(xiàn)接口如下表：
實(shí)現(xiàn)方式 說(shuō)明
New WebSocket(“ws://host:port/”); 發(fā)起與服務(wù)器建立WebSocket連接的對(duì)象
websocket.onopen()=function(){} 接收連接成功建立的響應(yīng)函數(shù)
websocket.onerror()=function(){} 接收異常信息的響應(yīng)函數(shù)
websocket.onmessage()=functionm(event){} 接收服務(wù)器返回的消息函數(shù)
websocket.onclose()=function(){} 接收連接關(guān)閉的響應(yīng)函數(shù)
sendMessage(event.data)=function(data){} 發(fā)送消息函數(shù)
websocket.close()=function(){} 連接關(guān)閉函數(shù)
本地緩存
IM的聊天消息采用本地緩存外莲，能有效的的提高性能
項(xiàng)目功能模塊主要分為
- 主體業(yè)務(wù)類
- websocket消息推送
- websocket消息接受
- 工具函數(shù)類
- dom模板渲染類
- 本地存儲(chǔ)類
- 頁(yè)面交互效果類
- 操作日志類
- 消息模板類
