ThinkPHP之WEBIM及時通訊(環信)

ThinkPHP之WEBIM及時通訊(環信)
ThinkPHP之WEBIM及時通訊(環信)

這裡實現 網頁–網頁 的及時聊天以及 網頁–手機端 的及時聊天。先上效果圖。

ThinkPHP之WEBIM及時通訊(環信)
ThinkPHP之WEBIM及時通訊(環信)

首先這裡使用的是環信的sdk,當然手機端(android和ios)同樣也是使用的環信的sdk。聊天資料沒有儲存在自己的伺服器。只在手機端做了快取。只有頭像是獲取自己伺服器的資料,別的都是環信處理。頭像為使用者id作為路徑。如(http://api.XXXX.com/uploads/person/911117.jpg),暱稱在使用者註冊時候傳遞給環信儲存。首先下載環信sdk 地址 http://www.easemob.com/download/im 。將下載好了的文件移動到專案Public下。

ThinkPHP之WEBIM及時通訊(環信)
ThinkPHP之WEBIM及時通訊(環信)

這裡我們需要修改的是demo文件下的Javascript/dist/demo-1.4.10.js文件,具體修改的內容就是使用者以及好友等的頭像和暱稱。改的地方比較多,大多是形如下圖這樣的

ThinkPHP之WEBIM及時通訊(環信)
ThinkPHP之WEBIM及時通訊(環信)

然後就是在模型中將使用者資訊傳遞給前臺js去處理,別的就不用管了。給個參考

ThinkPHP之WEBIM及時通訊(環信)
ThinkPHP之WEBIM及時通訊(環信)

前臺頁面的js部分

ThinkPHP之WEBIM及時通訊(環信)
ThinkPHP之WEBIM及時通訊(環信)

好了就是這麼簡單,在網頁端demo中實現了文字圖片語音,文件的傳送接收,以及視訊的接收。