WeChat Applet Integration Tencent Cloud IM SDK

Keywords: Javascript SDK github Session npm

1. Background

Since business functions require access to IM (Instant Chat) functionality, the initial thought was to use WebSockets to achieve this functionality. It was natural to trick (haha) that the server version is too low to support the wx protocol (and WebSockets are no longer supported) and have to look for third-party services because clients currently use WeChat.Applets to develop, that must be the use of their own IM features.This article is now available.

2. Document Address

1) Tencent Cloud Instant Chat: https://cloud.tencent.com/document/product/269

2) WeChat applet Demo: https://github.com/tencentyun/TIMSDK/tree/master/WXMini (Officially developed using MPVUE) This has been suggested. (My own app actually uses a different framework. I have to say that MPVUE has not started yet. It seems that I have to learn this framework. Tencent engineers use it and have to say that it is a good one.)Ordered Framework)

   3)IM SDK : https://imsdk-1252463788.file.myqcloud.com/IM_DOC/Web/Message.html?_ga=1.163142140.1311859679.1566291063

3. IM SDK Integration

3.1. Importing SDK

Import SDK s, that is, import their js files, download addresses: https://github.com/tencentyun/TIMSDK/tree/master/WXMini/sdk Or use the npm tool to import.There's no more verbosity here. By default, everyone will.

(For everyone to see, erase other unwanted bags)

 

 

3.2, Initialization

import TIM from 'tim-wx-sdk';
// For sending pictures, files, etc. messages COS SDK
import COS from "cos-wx-sdk-v5";//If chat is sent in plain text, import is not necessary here

let options = {
  SDKAppID: 0 // Need to replace 0 with your instant messaging application when accessing SDKAppID
};
// Establish SDK Example, TIM.create() Method is the same SDKAppID Only one instance will be returned
let tim = TIM.create(options); // SDK Instances are typically used tim Express

// register COS SDK Plug-in unit
tim.registerPlugin({'cos-wx-sdk': COS});//If chat is sent in plain text, no registration is required here

Set log level:

tim.setLogLevel(1);

3.3. Login

Before you log in, you need to know UserSig and generate UserSig on the server side.

UserSing: UserSig is the password used by users to log on to IM for instant messaging. It is essentially a cipher text encrypted from information such as UserID. This article will guide you how to generate UserSig.

The server generates UserSig: (Our server uses C#, check the official website for other languages: https://cloud.tencent.com/document/product/269/32688)

* Since our server uses C#, only the code that the C# server generates UserSig is given here

      

NuGet command line integration

PM> Install-Package tls-sig-api-v2

* Use

using tencentyun;

TLSSigAPIv2 api = new TLSSigAPIv2(1400000000, "5bd2850fff3ecb11d7c805251c51ee463a25727bddc2385f3fa8bfee1bb93b5e");
string sig = api.GenSig("userId");//UserId: Your userId should be
System.Console.WriteLine(sig);

tim login

 tim.login({
            userID: userId,
            userSig:userSig//Obtained through the server
          }).then((imResponse) => {
            console.log(imResponse.data); // Login Successful
            app.globalData.isImLogin = true
          }).catch((imError) => {
            console.warn('login error:', imError); // Information about login failure
          })

3.4. Receiving and receiving messages

Send (in plain text, for example):

// Send a text message, Web Same side as applet side
// 1. Create a message instance, and the instance returned by the interface can be displayed on the screen
let message = tim.createTextMessage({
  to: 'user1',
  conversationType: TIM.TYPES.CONV_C2C
  payload: {
    text: 'Hello world!'
  }
});
// 2. send message
let promise = tim.sendMessage(message);
promise.then(function(imResponse) {
  // Send Successfully
  console.log(imResponse);
}).catch(function(imError) {
  // fail in send
  console.warn('sendMessage error:', imError);
});

Receive:

let onMessageReceived = function(event) {
  // event.data - storage Message Array of objects - [Message]
};
tim.on(TIM.EVENT.MESSAGE_RECEIVED, onMessageReceived);

* Note*:

The tim.on(TIM.EVENT.MESSAGE_RECEIVED,function(event) {}) interface here is global and will be called the first time the applet starts, whenever new messages come to it.

After entering the chat interface, call the tim.getMessageList() interface to get the history of the chat.

Suggestion: Upon entering the chat interface, report this session as read, only if this setting is set (the first time the applet is started is listened on tim.on(TIM.EVENT.MESSAGE_RECEIVED,function(event) {}) will not receive the read message)

Read the newspaper:

// Update all unread messages in a session
tim.setMessageRead({conversationID: 'Conversation ID'});

3.5, Exit

tim.logout()

4. Completion

 

Explain:

1: If in doubt, you can contact me

2: Documents and SDK s will likely change after some time, since official documents are predominant

3: Official documents are given above

4: Article starts with public number

5: The applet packages used by the server are SDK s of great style. https://weixin.senparc.com)

Posted by daphreeek on Sun, 15 Sep 2019 18:42:51 -0700