环信WebIM 发送图片消息和显示图片 发送文件和显示文件 发送表情和显示表情
生活随笔
收集整理的這篇文章主要介紹了
环信WebIM 发送图片消息和显示图片 发送文件和显示文件 发送表情和显示表情
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
今天抽空用jquery做了一下環信的對接,沒有做布局,只對接了他們的api
先看下頁面
Html 代碼如下
<!DOCTYPE> <html> <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial.scale=1.0"><title>聊天</title> </head> <body><button onclick="register()">注冊</button> <button onclick="sendMsg()">發送消息</button> <button onclick="sendEmoji()">發送表情</button><input type="file" placeholder="請選擇圖片發送" value="請選擇圖片" onchange="sendImg(this)"/> 發送圖片<input type="file" placeholder="請選擇文件發送" value="請選擇文件" onchange="sendFile(this)"/>發送文件<input type="file" placeholder="請選擇音頻發送" value="請選擇文件" onchange="sendPrivateAudio(this)"/>發送音頻<input type="file" placeholder="請選擇視頻發送" value="請選擇文件" onchange="sendPrivateVideo(this)"/>發送視頻<!--<input placeholder="請復制圖片到此處"/>--><script src="../lib/webIM-SDK/webim.config.js"></script> <script src="../lib/webIM-SDK/strophe-1.2.8.js"></script> <script src="../lib/webIM-SDK/websdk-1.4.13.js"></script> <script src="index.js"></script> </body> </html>?
部分js代碼如下:
var conn = new WebIM.connection({isMultiLoginSessions: WebIM.config.isMultiLoginSessions,https: typeof WebIM.config.https === 'boolean' ? WebIM.config.https : location.protocol === 'https:',url: WebIM.config.xmppURL,heartBeatWait: WebIM.config.heartBeatWait,autoReconnectNumMax: WebIM.config.autoReconnectNumMax,autoReconnectInterval: WebIM.config.autoReconnectInterval,apiUrl: WebIM.config.apiURL,isAutoLogin: true }) conn.listen({onOpened: function (message) { //連接成功回調console.log('用戶已登錄環信')// 如果isAutoLogin設置為false，那么必須手動設置上線，否則無法收消息// 手動上線指的是調用conn.setPresence(); 如果conn初始化時已將isAutoLogin設置為true// 則無需調用conn.setPresence();},onClosed: function (message) {}, //連接關閉回調onTextMessage: function (message) { //收到文本消息console.log(`已收到文本消息,消息內容為${JSON.stringify(message)}`)},onEmojiMessage: function (message) { //收到表情消息// console.log(WebIM.utils.parseEmoji(message))console.log(`已收到表情消息,消息內容為${JSON.stringify(message)}`)},onPictureMessage: function (message) {//收到圖片消息console.log(`已收到圖片消息,消息內容為${JSON.stringify(message)}`)},onCmdMessage: function (message) {}, //收到命令消息onAudioMessage: function (message) { //收到音頻消息console.log(`已收到音頻消息,消息內容為${JSON.stringify(message)}`)},onLocationMessage: function (message) {},//收到位置消息onFileMessage: function (message) { //收到文件消息console.log(`已收到文件消息,消息內容為${JSON.stringify(message)}`)},onVideoMessage: function (message) { //收到視頻消息console.log(`已收到視頻消息,消息內容為${JSON.stringify(message)}`)var node = document.getElementById('privateVideo')var option = {url: message.url,headers: {'Accept': 'audio/mp4'},onFileDownloadComplete: function (response) {var objectURL = WebIM.utils.parseDownloadResponse.call(conn, response)node.src = objectURL},onFileDownloadError: function () {console.log('File down load error.')}}WebIM.utils.download.call(conn, option)},onPresence: function (message) {}, //處理“廣播”或“發布-訂閱”消息，如聯系人訂閱請求、處理群組、聊天室被踢解散等消息onRoster: function (message) {}, //處理好友申請onInviteMessage: function (message) {}, //處理群組邀請onOnline: function () {}, //本機網絡連接成功onOffline: function () {}, //本機網絡掉線onError: function (message) {}, //失敗回調onBlacklistUpdate: function (list) { //黑名單變動// 查詢黑名單，將好友拉黑，將好友從黑名單移除都會回調這個函數，list則是黑名單現有的所有好友信息console.log(list)},onReceivedMessage: function (message) {}, //收到消息送達服務器回執onDeliveredMessage: function (message) {}, //收到消息送達客戶端回執onReadMessage: function (message) {}, //收到消息已讀回執onCreateGroup: function (message) {}, //創建群組成功回執（需調用createGroupNew）onMutedMessage: function (message) {} //如果用戶在A群組被禁言，在A群發消息會走這個回調并且消息不會傳遞給群其它成員 })let urlParams = getParamsFromUrl() let currentUser = urlParams.currentUser let sendUser = urlParams.sendUser?
調試了發送文本,表情,圖片,文件,和音頻消息? 視頻消息由于SDK有問題,無法調通
?
?
有任何環信集成,對接的問題都可以咨詢我,時間寶貴,不免費幫人解決問題.謝謝
微信demon_0212 請注明 'CSDN環信集成'
總結
以上是生活随笔為你收集整理的环信WebIM 发送图片消息和显示图片 发送文件和显示文件 发送表情和显示表情的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： android 定位蓝牙,Android
- 下一篇： LM小型可编程控制器软件（基于CoDeS