ThinkPHP之WEBIM及時通信(環(huán)信)
這里實現(xiàn) 網(wǎng)頁--網(wǎng)頁 的及時聊天以及 網(wǎng)頁--手機端 的及時聊天。
先上效果圖。
ThinkPHP之WEBIM及時通信(環(huán)信)
首先這里使用的是環(huán)信的sdk,當(dāng)然手機端(android和ios)同樣也是使用的環(huán)信的sdk。聊天數(shù)據(jù)沒有存儲在自己的服務(wù)器。只在手機端做了緩存。只有頭像是獲取自己服務(wù)器的數(shù)據(jù),別的都是環(huán)信處理。頭像為用戶id作為路徑。如(http://api.XXXX.com/uploads/person/911117.jpg),昵稱在用戶注冊時候傳遞給環(huán)信保存。
首先下載環(huán)信sdk 地址 http://www.easemob.com/download/im 。將下載好了的文件移動到項目Public下。
ThinkPHP之WEBIM及時通信(環(huán)信)
這里我們需要修改的是demo文件下的javascript/dist/demo-1.4.10.js文件,具體修改的內(nèi)容就是用戶以及好友等的頭像和昵稱。改的地方比較多,大多是形如下圖這樣的
ThinkPHP之WEBIM及時通信(環(huán)信)
然后就是在模型中將用戶信息傳遞給前臺js去處理,別的就不用管了。給個參考
ThinkPHP之WEBIM及時通信(環(huán)信)
前臺頁面的js部分
ThinkPHP之WEBIM及時通信(環(huán)信)
好了就是這么簡單,在網(wǎng)頁端demo中實現(xiàn)了文字圖片語音,文件的發(fā)送接收,以及視頻的接收。
原創(chuàng)文章,轉(zhuǎn)載請注明出處