Tencent cloud im: the user terminal to realize the function of group message

Foreword:

        It is very convenient to implement Tencent Cloud IM on the server side, but it is also limited by the concurrency of Tencent IM. Here, the client side, that is, the front end, is provided to realize the related functions of group messages.

Realize the effect:

To achieve specific functional requirements:

1. Personnel with different permissions such as anchors, users, assistants, and shopping guides in the group can send messages to each other

2. The anchor can log in at the same time on the web side and the applet side (cross-terminal)

3. When one of them, such as a user sends a message, others will receive unread messages and display unread red dots

Prerequisite: Tencent Cloud Control Entry Point I

1. Your Tencent account must be the flagship version

2. You must open the console configuration: Function Configuration-"Group Configuration-"Group Function Configuration-"Group Message Read Receipt

Specific plan:

1. Call the sdk to create a group, and then save the group information to the backend library

2. Call the sdk to realize the exchange of messages. Note that the message format can be customized

3. Call sdk initialization to get whether there are unread messages of the group to control the little red dot

4. When sending messages to each other, monitor his real-time unread messages and control the little red dot

5. Click on read to call the read method of sdk to send messages

6. After reading, if there is a cross-end demand, send a message to yourself to tell yourself on different ends

7. Destroy the group (note that the client/front end cannot be realized here, because the sdk only provides the function of exiting the group, not destroying it )

Specific functions:

1. Create a group

tim.createGroup

// 创建好友工作群
    let promise = tim.createGroup({
      type: TIM.TYPES.GRP_WORK, //工作群
      name: 'haoxing-demo',
      introduction:'浩星的测试群',//群简介
      notification:'浩星的测试群',//群公告
      maxMemberNum:200, //最大群成员数量
      memberList: [
        {
          userID: "164315894311084****",
          // 群成员维度的自定义字段，默认情况是没有的，需要开通，详情请参阅自定义字段
          memberCustomField: [{nick: "冰雨如梦"}]
        },{
          userID: "162902479500371****",
          // 群成员维度的自定义字段，默认情况是没有的，需要开通，详情请参阅自定义字段
          memberCustomField: [{nick: "NULL"}]
        },{
          userID: "158482702290129****",
          // 群成员维度的自定义字段，默认情况是没有的，需要开通，详情请参阅自定义字段
          memberCustomField: [{nick: "浩星"}]
        },
      ] // 如果填写了 memberList，则必须填写 userID
    });
    promise.then(function(imResponse) { // 创建成功
      console.log(imResponse.data.group); // 创建的群的资料
      //groupID: "@TGS#1WC4LVRMO"


      // 创建群时指定了成员列表，但是成员中存在超过了“单个用户可加入群组数”限制的情况
      // 一个用户 userX 最多允许加入 N 个群，如果已经加入了 N 个群，此时创建群再指定 userX 为群成员，则 userX 不能正常加群
      // SDK 将 userX 的信息放入 overLimitUserIDList，供接入侧处理
      console.log(imResponse.data.overLimitUserIDList); // 超过了“单个用户可加入群组数”限制的用户列表，v2.10.2起支持
    }).catch(function(imError) {
      console.warn('createGroup error:', imError); // 创建群组失败的相关信息
    });

2. Add a user to the group

tim.addGroupMember group add people

tim.joinGroup  user application to join the group  

3. Query the detailed information of the group to determine whether to create the group

tim.getGroupProfile

4. Users in the group send messages to each other

tim.createTextMessage

tim.sendMessage

// 发送群消息
let message = tim.createTextMessage({
  to: '@TGS#32C53VPMP', //群id
  conversationType: TIM.TYPES.CONV_GROUP, //类型
  payload: {
    text: '我是额外的！！！',
    source:'前端自己发送信息！'
  },
  // v2.18.0起支持群消息已读回执功能，如果您发消息需要已读回执，需购买旗舰版套餐，并且创建消息时将 needReadReceipt 设置为 true
  needReadReceipt: true
});
// 发送消息
let promise = tim.sendMessage(message);
promise.then(function(imResponse) {
	// 发送成功
	console.log(imResponse);
}).catch(function(imError) {
	// 发送失败
	console.warn('sendMessage error:', imError);
});

5. Monitor the unread status of your own messages in the group

tim.on(TIM.EVENT.MESSAGE_READ_RECEIPT_RECEIVED, onMessageReadReceiptReceived);

6. Get the unread messages of the group

tim.getConversationList

7. Cross-terminal problem solving

        Because im itself only supports cross-terminal messages, that is, when the user sends a message, the anchor account logged in on your web end and the anchor account logged in on the applet end can both receive the message at the same time, but I want to receive it on the web end Call the read method after the message to let the applet know that it has been read and update the data, which cannot be realized.

Implementation:

        Create a C2C chat, send a message to yourself, as long as both parties are online at the same time, you can receive it

sendNoReadFun(){
      // 发送其他端消息
      let message = this.tim.createTextMessage({
        to: "1572546702042263554", //web端和小程序端同一个userid
        conversationType: TIM.TYPES.CONV_C2C,
        payload: {
          text: '我点击了已读，你收到了嘛',
        },
        // v2.18.0起支持群消息已读回执功能，如果您发消息需要已读回执，需购买旗舰版套餐，并且创建消息时将 needReadReceipt 设置为 true
        needReadReceipt: true
      });
      // 发送消息
      let promise = this.tim.sendMessage(message);
      promise.then(function(imResponse) {
        // 发送成功
        console.log(imResponse);
        debugger
      }).catch(function(imError) {
        // 发送失败
        console.warn('sendMessage error:', imError);
      });
    },