差别

这里会显示出您选择的修订版和当前版本之间的差别。

到此差别页面的链接

两侧同时换到之前的修订记录 前一修订版
后一修订版
前一修订版
im:web:basics:message [2019/12/04 08:14]
lizg [消息]
im:web:basics:message [2020/09/25 07:08] (当前版本)
allenwang
行 11: 行 11:
   * 处理消息   * 处理消息
    
-  * 拉取历史消息+  * 消息漫游
  
   * 新消息提醒   * 新消息提醒
行 20: 行 20:
 ===== 构造消息 ===== ===== 构造消息 =====
 <code javascript>​ <code javascript>​
-var msg = new WebIM.message('​txt',​ id); +let msg = new WebIM.message('​txt',​ id); 
-msg.set(option); ​            ​//​消息内容option,下面会有详细介绍 +msg.set(option); ​               //​消息内容option,下面会有详细介绍 
-msg.setGroup('groupchat'​); ​  //​用于设置当前聊天模式为多人天,如聊天室/群组。单聊不调用此方法+msg.setChatType('groupChat'​); ​  //​用于设置当前聊天模式为、群聊(groupChat)、聊天室(chatRoom),不设置默认为单聊
 </​code>​ </​code>​
  
-**注意:** 发送ext 扩展消息,可以没有这个字段,但是如果有,值不能是ext:null这种形式,否则出错+**注意:** 发送ext 扩展消息,可以没有这个字段,但是如果有,值不能是"ext:null"这种形式,否则出错
 ===== 发送消息 ===== ===== 发送消息 =====
  
行 40: 行 40:
   ​   ​
   * 附件消息   * 附件消息
 +
 +  * 自定义消息
  
 多样化的消息类型,覆盖多种场景下的消息需求。 多样化的消息类型,覆盖多种场景下的消息需求。
-==== 发送文本消息(单聊) ====+==== 发送文本消息(单聊、扩展) ====
  
 单聊发送文本消息示例如下: 单聊发送文本消息示例如下:
行 48: 行 50:
 <code javascript>​ <code javascript>​
 // 单聊发送文本消息 // 单聊发送文本消息
-var sendPrivateText ​= function ​() { +function ​sendPrivateText() { 
-    ​var id = conn.getUniqueId(); ​                // 生成本地消息id +    ​let id = conn.getUniqueId(); ​                // 生成本地消息id 
-    ​var msg = new WebIM.message('​txt',​ id);      // 创建文本消息+    ​let msg = new WebIM.message('​txt',​ id);      // 创建文本消息
     msg.set({     msg.set({
         msg: '​message content', ​                 // 消息内容         msg: '​message content', ​                 // 消息内容
         to: '​username', ​                         // 接收消息对象(用户id)         to: '​username', ​                         // 接收消息对象(用户id)
-        ​roomTypefalse+        ​chatType'​singleChat'​                 // 设置为单聊 
-        ext: {},                                  //​扩展消息+        ext: { 
 +            key: value, 
 +            key2: { 
 +                key3: value2 
 +            } 
 +        ​},                                  //​扩展消息
         success: function (id, serverMsgId) {         success: function (id, serverMsgId) {
             console.log('​send private text Success'​);  ​             console.log('​send private text Success'​);  ​
行 71: 行 78:
 <code javascript>​ <code javascript>​
 // 群组发送文本消息 // 群组发送文本消息
-var sendGroupText ​= function ​() { +function ​sendGroupText() { 
-    ​var id = conn.getUniqueId(); ​           // 生成本地消息id +    ​let id = conn.getUniqueId(); ​           // 生成本地消息id 
-    ​var msg = new WebIM.message('​txt',​ id); // 创建文本消息 +    ​let msg = new WebIM.message('​txt',​ id); // 创建文本消息 
-    ​var option = {+    ​let option = {
         msg: '​message content', ​            // 消息内容         msg: '​message content', ​            // 消息内容
         to: 'group id', ​                    // 接收消息对象(群组id)         to: 'group id', ​                    // 接收消息对象(群组id)
-        ​roomTypefalse                   // 群聊类型,true时为聊天室,false时为群组+        ​chatType'​groupChat'​             // 群聊类型设置
         ext: {},                            // 扩展消息         ext: {},                            // 扩展消息
         success: function () {         success: function () {
行 87: 行 94:
     };     };
     msg.set(option);​     msg.set(option);​
-    msg.setGroup('​groupchat'​); ​             // 群聊类型 
     conn.send(msg.body);​     conn.send(msg.body);​
 }; };
行 96: 行 102:
 <code javascript>​ <code javascript>​
 // 聊天室发送文本消息 // 聊天室发送文本消息
-var sendRoomText ​= function ​() { +function ​sendRoomText() { 
-    ​var id = conn.getUniqueId(); ​        // 生成本地消息id +    ​let id = conn.getUniqueId(); ​        // 生成本地消息id 
-    ​var msg = new WebIM.message('​txt',​ id); // 创建文本消息 +    ​let msg = new WebIM.message('​txt',​ id); // 创建文本消息 
-    ​var option = {+    ​let option = {
         msg: '​message content', ​         // 消息内容         msg: '​message content', ​         // 消息内容
         to: '​chatroom id', ​              // 接收消息对象(聊天室id)         to: '​chatroom id', ​              // 接收消息对象(聊天室id)
-        ​roomTypetrue                 // 群聊类型,true时为聊天室,false时为群组+        ​chatType'​chatRoom'​           // 群聊类型设置为聊天室
         ext: {},                         // 扩展消息         ext: {},                         // 扩展消息
         success: function () {         success: function () {
行 112: 行 118:
     };     };
     msg.set(option);​     msg.set(option);​
-    msg.setGroup('​groupchat'​); ​          // 群聊类型 
     conn.send(msg.body);​     conn.send(msg.body);​
 }; };
 </​code>​ </​code>​
  
-**注意:**单聊和群聊的表现示例基本一样,区别在于 +**注意:**单聊和群聊的表现示例基本一样,区别在于接受消息的对象不同,单聊 to 的对象为**用户 ID **,​群组/​聊天室 to 的对象为**群组/​聊天室 ID**
-  * 接受消息的对象不同,单聊 to 的对象为**用户 ID **,​群组/​聊天室 to 的对象为**群组/​聊天室 ID**+
   ​   ​
-  * 聊天室/​群组 比单聊代码中调一个方法 ''​msg.setGroup('​groupchat'​) ''​ 
-  ​ 
-  * 通过''​roomType''​区分聊天室、群组,true为聊天室,false为群组 
  
-=== API === +-----
-示例中使用到的 API +
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​getUniqueId|getUniqueId]] +
-   +
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​send|send]] +
- +
-----+
  
 ==== 发送表情消息 ==== ==== 发送表情消息 ====
  
-  * 发送表情同发送文本消息,需要在对方客户端将表情文本进行解析成图片。 +发送表情同发送文本消息,需要在对方客户端将表情文本进行解析成图片。
-  +
-  * 示例代码为单聊,贴图发送至群组和聊天室时需参考**发送文本消息**修改''​roomType''​和''​msg.setGroup('​groupchat'​)''​+
  
 单聊发送表情消息的代码示例如下: 单聊发送表情消息的代码示例如下:
行 156: 行 149:
         msg: '​message content', ​                 // 消息内容         msg: '​message content', ​                 // 消息内容
         to: '​username', ​                         // 接收消息对象(用户id)         to: '​username', ​                         // 接收消息对象(用户id)
-        ​roomTypefalse,+        ​chatType'​singleChat'​,
         success: function (id, serverMsgId) {         success: function (id, serverMsgId) {
             console.log('​send private text Success'​);​             console.log('​send private text Success'​);​
行 167: 行 160:
 }; };
 </​code>​ </​code>​
-**注意:**%%当为 WebIM 添加了 Emoji 属性后,若发送的消息含 WebIM.Emoji 里特定的字符串,connection 就会自动将这些字符串和其它文字按顺序组合成一个数组,每一个数组元素的结构为 {type:'​emoji(或者txt)',​data:''​}%%+**注意:**%%当为 WebIM 添加了 Emoji 属性后,若发送的消息含 WebIM.Emoji 里特定的字符串,connection 就会自动将这些字符串和其它文字按顺序组合成一个数组,每一个数组元素的结构为 {type:'​emoji(或者txt)',​data:'​msg(或者src)'}%%
  
 当 type='​emoji'​ 时,data 表示**表情图像的路径**; 当 type='​emoji'​ 时,data 表示**表情图像的路径**;
行 173: 行 166:
 当 type='​txt'​ 时,data 表示**文本消息**。 当 type='​txt'​ 时,data 表示**文本消息**。
  
-=== API === 
-示例中使用到的 API  
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​listen|listen]] 
-  ​ 
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​getUniqueId|getUniqueId]] 
-  ​ 
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​send|send]] 
  
 ---- ----
 ==== 发送贴图消息 ==== ==== 发送贴图消息 ====
  
-  * Web IM SDK本身不支持截图,使用下述代码可以实现用户粘贴图片至输入框后发送。 +Web IM SDK本身不支持截图,使用下述代码可以实现用户粘贴图片至输入框后发送。
-   +
-  * 示例代码为单聊,贴图发送至群组和聊天室时需参考**发送文本消息**修改''​roomType''​和''​msg.setGroup('​groupchat'​)''​+
  
 单聊发送贴图消息的代码示例如下: 单聊发送贴图消息的代码示例如下:
行 203: 行 187:
                     file: {data: blob, url: url},                     file: {data: blob, url: url},
                     to: '​username', ​                     // 接收消息对象                     to: '​username', ​                     // 接收消息对象
-                    ​roomTypefalse,+                    ​chatType'​singleChat'​,
                     onFileUploadError:​ function (error) {                     onFileUploadError:​ function (error) {
                         console.log('​Error'​);​                         console.log('​Error'​);​
行 220: 行 204:
 }); });
 </​code>​ </​code>​
- 
-=== API === 
-示例中使用到的 API  ​ 
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​getUniqueId|getUniqueId]] 
-  ​ 
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​send|send]] 
  
 ---- ----
 ==== 发送URL图片消息 ==== ==== 发送URL图片消息 ====
    
-  * 示例代码为单聊贴图发送至群组和聊天室时参考**发送文本消息**修改''​roomType''​和''​msg.setGroup('groupchat')''​。+App端需要开发者自己实现下载Web端要在 WebIMConfig.js中 设置 ​''​useOwnUploadFun:​ true''​。
  
 单聊通过URL发送图片消息的代码示例如下: 单聊通过URL发送图片消息的代码示例如下:
行 237: 行 215:
  var sendPrivateUrlImg = function () {  var sendPrivateUrlImg = function () {
     var id = conn.getUniqueId(); ​                  // 生成本地消息id     var id = conn.getUniqueId(); ​                  // 生成本地消息id
-    var msg = new WebIM.default.message('​img',​ id);        // 创建图片消息+    var msg = new WebIM.message('​img',​ id);        // 创建图片消息
     var option = {     var option = {
         body: {         body: {
行 256: 行 234:
  }  }
 </​code>​ </​code>​
- 
-=== API === 
-示例中使用到的 API  ​ 
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​getUniqueId|getUniqueId]] 
-  ​ 
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​send|send]] 
  
 ---- ----
行 271: 行 243:
  
 msg.set({ msg.set({
-  msg: '​msg',​ 
   to: '​username', ​                       //​接收消息对象   to: '​username', ​                       //​接收消息对象
   action : '​action', ​                    //​用户自定义,cmd消息必填   action : '​action', ​                    //​用户自定义,cmd消息必填
   ext :​{'​extmsg':'​extends messages'​}, ​   //​用户自扩展的消息内容(群聊用法相同)   ext :​{'​extmsg':'​extends messages'​}, ​   //​用户自扩展的消息内容(群聊用法相同)
   success: function ( id,​serverMsgId ) {}//​消息发送成功回调 ​     success: function ( id,​serverMsgId ) {}//​消息发送成功回调 ​  
-});  +});   
- +
-if ( /​*如果是发送到群组*/​ ) {  +
-  msg.setGroup('​groupchat'​);​ +
-} else if ( /​*如果是发送到聊天室*/​ ) { +
-  msg.body.roomType = true; +
-  msg.setGroup('​groupchat'​);​ +
-  ​+
  
 conn.send(msg.body);​ conn.send(msg.body);​
 </​code>​ </​code>​
- 
-=== API === 
-示例中使用到的 API  ​ 
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​getUniqueId|getUniqueId]] 
-  ​ 
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​send|send]] 
  
 ---- ----
行 307: 行 265:
 **·** 发送附件消息,SDK 自动分两步完成: **·** 发送附件消息,SDK 自动分两步完成:
   - 上传附件到服务器,并得到服务返回的附件信息等;   - 上传附件到服务器,并得到服务返回的附件信息等;
-  - 发送附件消息,消息体包含附件的基本信息、服务器路径、secret 等。 ​        +  - 发送附件消息,消息体包含附件的基本信息、服务器路径、secret 等。 
-**·** 示例代码为单聊贴图发送至群组和聊天室时参考**发送文本消息**修改''​roomType''​和''​msg.setGroup('​groupchat'​)''​。+ 
 +注意:web端和小程序发送附件消息是有区别的小程序发送附件消息要自己将附件上传到环信服务器,下面以发送图片消息展示小程序怎样发送附件消息 ​       ​
  
 单聊发送图片消息示例如下: 单聊发送图片消息示例如下:
 <code javascript>​ <code javascript>​
-// 单聊发送图片消息+// web单聊发送图片消息
 var sendPrivateImg = function () { var sendPrivateImg = function () {
     var id = conn.getUniqueId(); ​                  // 生成本地消息id     var id = conn.getUniqueId(); ​                  // 生成本地消息id
行 328: 行 287:
             apiUrl: WebIM.config.apiURL,​             apiUrl: WebIM.config.apiURL,​
             file: file,             file: file,
 +            length: '​3000', ​                      // 视频文件时,单位(ms)
 +            ext: {
 +                file_length:​ file.data.size ​      // 文件大小
 +            },
             to: '​username', ​                      // 接收消息对象             to: '​username', ​                      // 接收消息对象
-            ​roomTypefalse,+            ​chatType'​singleChat'​              // 设置为单聊
             onFileUploadError:​ function () {      // 消息上传失败             onFileUploadError:​ function () {      // 消息上传失败
                 console.log('​onFileUploadError'​);​                 console.log('​onFileUploadError'​);​
行 345: 行 308:
     }     }
 }; };
 +
 +// 小程序单聊发送图片消息
 +sendImage(){
 +    const me = this;
 +    wx.chooseImage({
 +        count: 1,
 +        sizeType: ["​original",​ "​compressed"​],​
 +        sourceType: ["​album"​],​
 +        success(res){
 +            me.upLoadImage(res);​
 +        }
 +    });
 +}
 +upLoadImage(res){
 +    const me = this;
 +    let tempFilePaths = res.tempFilePaths;​
 +    let token = WebIM.conn.context.accessToken
 +    wx.getImageInfo({
 + src: res.tempFilePaths[0],​
 + success(res){
 +        let allowType = {jpg: true, gif: true, png: true, bmp: true};
 +        let str = WebIM.config.appkey.split("#"​);​
 +        let width = res.width;
 +        let height = res.height;
 +        let index = res.path.lastIndexOf("​."​);​
 +        let filetype = (~index && res.path.slice(index + 1)) || "";​
 +        let domain = wx.WebIM.conn.apiUrl + '/'​
 +        if(filetype.toLowerCase() in allowType){
 +            wx.uploadFile({
 +                url: domain + str[0] + "/"​ + str[1] + "/​chatfiles",​
 +                filePath: tempFilePaths[0],​
 +                name: "​file",​
 +                header: {
 +                    "​Content-Type":​ "​multipart/​form-data",​
 +                    Authorization:​ "​Bearer " + token
 +                },
 +                success(res){
 +                    if(res.statusCode === 400){
 +                        // 图片上传阿里云检验不合法
 +                        let errData = JSON.parse(res.data);​
 +                        if (errData.error === '​content improper'​) {
 +                            wx.showToast({
 +                                title: '​图片不合法'​
 +                            });
 +                            return
 +                        }
 +                    }
 +                    let data = res.data;
 +                    let dataObj = JSON.parse(data);​
 +                    let id = WebIM.conn.getUniqueId();​ // 生成本地消息 id
 +                    let msg = new WebIM.message(msgType.IMAGE,​ id);
 +                    let file = {
 +                        type: msgType.IMAGE,​
 +                        size: {
 +                            width: width,
 +                            height: height
 +                        },
 +                        url: dataObj.uri + "/"​ + dataObj.entities[0].uuid,​
 +                        filetype: filetype,
 +                        filename: tempFilePaths[0]
 +                    };
 +                    msg.set({
 +                        apiUrl: WebIM.config.apiURL,​
 +                        body: file,
 +                        from: me.data.username.myName,​
 +                        to: me.getSendToParam(),​
 +                        chatType: me.data.chatType,​
 +                        success: function (argument) {}
 +                    });
 +                    WebIM.conn.send(msg.body);​
 +                }
 +            });
 +        }
 +    }
 +});
 +}
 </​code>​ </​code>​
  
行 370: 行 409:
             file: file,             file: file,
             to: '​username', ​                      // 接收消息对象             to: '​username', ​                      // 接收消息对象
-            ​roomTypefalse,+            ​chatType'​singleChat'​              // 设置单聊
             onFileUploadError:​ function () {      // 消息上传失败             onFileUploadError:​ function () {      // 消息上传失败
                 console.log('​onFileUploadError'​);​                 console.log('​onFileUploadError'​);​
行 380: 行 419:
                 console.log('​Success'​);​                 console.log('​Success'​);​
             },             },
-            flashUpload:​ WebIM.flashUpload+            flashUpload:​ WebIM.flashUpload
 +            ext: {file_length:​ file.data.size}
         };         };
         msg.set(option);​         msg.set(option);​
行 405: 行 445:
             apiUrl: WebIM.config.apiURL,​             apiUrl: WebIM.config.apiURL,​
             file: file,             file: file,
 +            length: '​3', ​                         // 音频文件时长,单位(s)
             to: '​username', ​                      // 接收消息对象             to: '​username', ​                      // 接收消息对象
-            ​roomTypefalse,+            ​chatType'​singleChat'​              // 设置单聊
             onFileUploadError:​ function () {      // 消息上传失败             onFileUploadError:​ function () {      // 消息上传失败
                 console.log('​onFileUploadError'​);​                 console.log('​onFileUploadError'​);​
行 416: 行 457:
                 console.log('​Success'​);​                 console.log('​Success'​);​
             },             },
-            flashUpload:​ WebIM.flashUpload+            flashUpload:​ WebIM.flashUpload
 +            ext: {file_length:​ file.data.size}
         };         };
         msg.set(option);​         msg.set(option);​
行 444: 行 486:
             file: file,             file: file,
             to: '​username', ​                      // 接收消息对象             to: '​username', ​                      // 接收消息对象
-            ​roomTypefalse,+            ​chatTypesingleChat                // 设置为单聊
             onFileUploadError:​ function () {      // 消息上传失败             onFileUploadError:​ function () {      // 消息上传失败
                 console.log('​onFileUploadError'​);​                 console.log('​onFileUploadError'​);​
行 454: 行 496:
                 console.log('​Success'​);​                 console.log('​Success'​);​
             },             },
-            flashUpload:​ WebIM.flashUpload+            flashUpload:​ WebIM.flashUpload
 +            ext: {file_length:​ file.data.size}
         };         };
         msg.set(option);​         msg.set(option);​
行 462: 行 505:
 </​code>​ </​code>​
  
-=== API === +==== 发送自定义消息 ==== 
-示例中使用到的 API +单聊发送自定义消息示例如下: 
-  * [[http://webim-h5.easemob.com/jsdoc/out/connection.html#​getUniqueId|getUniqueId]] +<code javascript>​ 
-   +var sendCustomMsg = function () { 
-  * [[http://webim-h5.easemob.com/jsdoc/out/connection.html#send|send]]+    var id = conn.getUniqueId(); ​                // 生成本地消息id 
 +    var msg = new WebIM.message('​custom',​ id);   // 创建自定义消息 
 +    var customEvent = "​customEvent"; ​            // 创建自定义事件 
 +    var customExts = {};                         // 消息内容,key/​value 需要 string 类型 
 +    msg.set({ 
 +        to: '​username', ​                         ​// 接收消息对象(用户id) 
 +        customEvent,​ 
 +        customExts,​ 
 +        ext:​{}, ​                                 ​// 消息扩展 
 +        roomType: false, 
 +        success: function (id, serverMsgId) {}, 
 +        fail: function(e){} 
 +    }); 
 +    conn.send(msg.body);​ 
 +}; 
 +</​code>​
  
 ---- ----
行 482: 行 540:
 </​code>​ </​code>​
 ---- ----
 +
 +
 ===== 接收消息 ===== ===== 接收消息 =====
 查看回调函数,接收各类消息的回调函数代码如下: 查看回调函数,接收各类消息的回调函数代码如下:
行 496: 行 556:
     onLocationMessage:​ function ( message ) {},//​收到位置消息     onLocationMessage:​ function ( message ) {},//​收到位置消息
     onFileMessage:​ function ( message ) {},    //​收到文件消息     onFileMessage:​ function ( message ) {},    //​收到文件消息
 +    onCustomMessage:​ function ( message ) {},  //​收到自定义消息
     onVideoMessage:​ function (message) {     onVideoMessage:​ function (message) {
         var node = document.getElementById('​privateVideo'​);​         var node = document.getElementById('​privateVideo'​);​
行 523: 行 584:
         console.log(list);​         console.log(list);​
     },     },
-    ​recallMessage: function( message ){},      //​收到消息撤回回执+    ​onRecallMessage: function( message ){},    //​收到消息撤回回执
     onReceivedMessage:​ function(message){}, ​   //​收到消息送达服务器回执     onReceivedMessage:​ function(message){}, ​   //​收到消息送达服务器回执
     onDeliveredMessage:​ function(message){}, ​  //​收到消息送达客户端回执     onDeliveredMessage:​ function(message){}, ​  //​收到消息送达客户端回执
行 531: 行 592:
 }); });
 </​code>​ </​code>​
- 
- 
-=== API === 
-示例中使用到的 API 
-  * [[http://​webim-h5.easemob.com/​jsdoc/​out/​connection.html#​listen|listen]] 
  
 ----            ​ ----            ​
行 561: 行 617:
 </​code>​ </​code>​
  
-**注意:**当为 WebIM 添加了 Emoji 属性后,若发送的消息含 WebIM.Emoji 里特定的字符串,connection 就会自动将这些字符串和其它文字按顺序组合成一个数组,每一个数组元素的结构为 **{type:'​emoji(或者txt)',​data:​''​}**+**注意:**当为 WebIM 添加了 Emoji 属性后,若发送的消息含 WebIM.Emoji 里特定的字符串,connection 就会自动将这些字符串和其它文字按顺序组合成一个数组,每一个数组元素的结构为 **{type:'​emoji(或者txt)',​data:​type}**
  
 当 type='​emoji'​ 时,data 表示**表情图像的路径**; 当 type='​emoji'​ 时,data 表示**表情图像的路径**;
行 584: 行 640:
 conn.listen({ conn.listen({
   onAudioMessage:​ function ( message ) {   onAudioMessage:​ function ( message ) {
-    ​var options = { url: message.url }; +    // 在这里接收音频消息
-     +
-    options.onFileDownloadComplete = function ( response ) {  +
-      ​//音频下载成功,需要将response转换成blob,使用objectURL作为audio标签的src即可播放。 +
-      var objectURL = WebIM.utils.parseDownloadResponse.call(Demo.conn,​ response);​ +
-    };   +
- +
-    options.onFileDownloadError = function () { +
-      //​音频下载失败  +
-    };   +
- +
-    //​通知服务器将音频转为mp3 +
-    options.headers = {  +
-      '​Accept':​ '​audio/​mp3'​ +
-    }; +
- +
-    WebIM.utils.download.call(conn,​ options);+
   }   }
 }) })
 +// 小程序播放
 +playAudio(message){
 +  let audioCtx = wx.createInnerAudioContext();​
 +  let curl = ''​
 +  wx.downloadFile({
 +  url: message.url,​
 +  header: {
 +    "​X-Requested-With":​ "​XMLHttpRequest",​
 +    Accept: "​audio/​mp3",​
 +    Authorization:​ "​Bearer " + this.data.msg.msg.token
 +  },
 +  success(res){
 +    curl = res.tempFilePath;​
 +    audioCtx.src = curl;
 +    audioCtx.play();​
 +  },
 +  fail(e){
 +    wx.showToast({
 +      title: "​下载失败",​
 +      duration: 1000
 +    });
 +  }
 +});
 +
 +// web
 +addAudioMessage:​ (message, bodyType) => {
 +  return (dispatch, getState) => {
 +    let options = {
 +          url: message.url,​
 +          headers: {
 +            Accept: '​audio/​mp3'​
 +          },
 +          onFileDownloadComplete:​ function (response) {
 +            let objectUrl = WebIM.utils.parseDownloadResponse.call(WebIM.conn,​ response)
 +            message.audioSrcUrl = message.url
 +              message.url = objectUrl
 +            },
 +          onFileDownloadError:​ function () {}
 +        }
 +      WebIM.utils.download.call(WebIM.conn,​ options)
 +   }
 +}
 </​code>​ </​code>​
  
 **注意:** **注意:**
-  * conn.listen() 中注册不同消息接收 handler 之后,可自行解析消息体,定位聊天好友,并追加到与其聊天窗口。具体参考 http://​webim.easemob.com 效果。 
- 
   * 对于图片、语音消息需要先进行下载,然后进行显示或者播放处理。   * 对于图片、语音消息需要先进行下载,然后进行显示或者播放处理。
  
行 615: 行 695:
  
 ---- ----
-===== 拉取历史消息 =====+===== 消息漫游 ​=====
  
-漫游消息,SDK增值功能。+漫游消息,''​SDK增值功能''​
 <code javascript>​ <code javascript>​
 /** /**
行 646: 行 726:
 ---- ----
 ===== 消息回执 ===== ===== 消息回执 =====
 + ​单聊:
   * 已送达回执:在 webim.config.js 中配置 delivery 为 true ,在收到消息时会自动发送已送达回执,对方收到已送达回执的回调函数是 onDeliveredMessage   * 已送达回执:在 webim.config.js 中配置 delivery 为 true ,在收到消息时会自动发送已送达回执,对方收到已送达回执的回调函数是 onDeliveredMessage
   ​   ​
   * 已读回执:当认为用户已读某条(些)消息时,可以生成已读回执,再进行发送   * 已读回执:当认为用户已读某条(些)消息时,可以生成已读回执,再进行发送
   ​   ​
-  * 对方收到已送达回执的回调函数是 onReadMessage+对方收到已送达回执的回调函数是 onReadMessage
 <code javascript>​ <code javascript>​
 var bodyId = message.id; ​        // 需要发送已读回执的消息id var bodyId = message.id; ​        // 需要发送已读回执的消息id
行 659: 行 739:
     ,to: message.from     ,to: message.from
 }); });
-Demo.conn.send(msg.body);​+conn.send(msg.body);​
 </​code>​ </​code>​
  
-=== API ==+ 
-示例中使用到的 ​API    ​ +群聊''​SDK增值功能''​: 
-  * [[http://webim-h5.easemob.com/jsdoc/out/​connection.html#send|send]]+ 
 +  * 发送群可以收已读回执的消息  
 +<code javascript>​ 
 + ​sendGroupReadMsg ​() => { 
 +  let id conn.getUniqueId(); ​                // 生成本地消息id 
 +  let msg new WebIM.message('​txt',​ id);      // 创建文本消息 
 +  ​msg.set({ 
 +     msg: '​message content', ​                 // 消息内容 
 +     to: '​username', ​                         // 接收消息对象(户id) 
 +     ​chatType:​ '​groupChat', ​                  // 设置为群聊 
 +     ​success:​ function (id, serverMsgId) { 
 +         ​console.log('​send private text Success'​);​ 
 +     }, 
 +     fail: function(e){ 
 +         ​console.log("​Send private text error"​);​ 
 +     } 
 +  }); 
 +  msgObj.body.msgConfig = { allowGroupAck:​ true } 
 +  conn.send(msg.body);​ 
 +
 + </​code>​ 
 +  * 收需要回执消息后发送回执  
 + 
 +<code javascript>​ 
 + ​sendReadMsg = () => { 
 +  let msg = new WebIM.message("​read",​ WebIM.conn.getUniqueId());​ 
 +  msg.body.chatType = "​groupChat";​ 
 +  msg.body.msgConfig = { allowGroupAck:​ true }; 
 +  msg.body.ackContent = JSON.stringify({});​ 
 +  WebIM.conn.send(msg.body);​ 
 +
 +</​code>​ 
 +  * 监听收到群组消息回执:分两种情况 1、正常在线时可以在 onReadMessage 函数里监听到回执,2、离线时收到群组消息回执,登录后会在onStatisticMessage函数里监听到回执  
 + 
 +<code javascript>​ 
 +// 在线时可以在onReadMessage里监听 
 +onReadMessage(message) => { 
 +  const { mid } = message; 
 +  const msg = { 
 +    id: mid 
 +  }; 
 +  if(message.groupReadCount){ 
 +    ​// 消息阅读数 
 +    msg.groupReadCount = message.groupReadCount[message.mid];​ 
 +  } 
 +
 +       
 +// 离线时收到回执,登录后会在这里监听到 
 +onStatisticMessage:​ (message) => { 
 +  let statisticMsg = message.location && JSON.parse(message.location);​ 
 +  let groupAck = statisticMsg.group_ack ​|| []
 +
 +</​code>​ 
 +  * 查看读过消息的用户 
 +<code jacascript>​ 
 +WebIM.conn.getGroupMsgReadUser({ 
 +    msgId, ​ // 消息id 
 +    groupId // 群组id 
 +}).then((res)=>​{ 
 +    console.log(res) 
 +}) 
 +</​code>​
  
 ---- ----