环信小程序SDK简介

环信小程序 SDK 为小程序开发提供一套完整的技术解决方案，在微信小程序的开发环境下，集成 IM 相关的功能更加便捷、高效。扫描下方小程序二维码或者微信二维码可以快速体验环信小程序在线版本。

功能说明

1.环信微信小程序 WebIM 在微信生态系统进行优化，功能与微信对接更为流畅：
2.支持账户注册登录
3.支持 IM 基本功能收发文本、图片、语音、视频、音频、文件、透传、扩展消息等
4.支持 群组聊天室功能
5.支持个人设置

开发者集成

集成前准备

注册并创建应用

搭建小程序开发环境

小程序自己有一个专门的微信开发者工具，最新版本下载地址。
这一步比较简单，按照提示一步步安装好就行，然后用微信扫描二维码登陆。 至此小程序的开发环境差不多完成。

配置服务器域名

登录微信公众平台，进入“开发 > 开发设置”页面，配置以下服务器地址：

• request合法域名， uploadFile合法域名
  1、https://a1.easemob.com
  2、https://a2.easemob.com
  3、https://a3.easemob.com
  4、https://a4.easemob.com
  5、https://a5.easemob.com
• socket合法域名
  wss://im-api.easemob.com

将SDK添加到自己的小程序

下载SDK

可以通过以下两种方式获取SDK：

1. 通过官网下载SDK （暂时没有）
2. 从我们的github仓库 demo中获取sdk中的文件

引入SDK

• 开始一个全新的项目
  1. 将sdk目录下的文件全部倒入到自己的项目中。
  2. 直接使用import/require方式获取引用, 如果使用mpvue保持引文件方式的统一。
• 基于demo二次开发
  拉取代码，导入开发者工具即可运行起来。

调用示例：

//使用示例
import SDK from "../sdk/connection";

实例调用方式

采用单例模式，所有业务使用唯一实例

//实例化SDK对象
const WebIM = window.WebIM = SDK;
WebIM.conn = new WebIM.connection({
    isMultiLoginSessions: false, //是否可以登录多个网页，并在所有网页上接收消息
    https: false, //是否使用HTTPS 
    url: 'wss://im-api.easemob.com/ws/', //XMPP server
    apiUrl: 'https://a1.easemob.com',
    isAutoLogin: false, //自动登录
    heartBeatWait: 4500, //心跳间隔
    autoReconnectNumMax: 2, //自动重连次数
    autoReconnectInterval: 2, //每个重新连接之间的间隔秒, 自动重连次数大于1时有效。
});

SDK基础功能

事件监听

WebIM.conn.listen({
 onOpened: function ( message ) {          //连接成功回调
        // 如果isAutoLogin设置为false，那么必须手动设置上线，否则无法收消息
        // 手动上线指的是调用conn.setPresence(); 如果conn初始化时已将isAutoLogin设置为true
        // 则无需调用conn.setPresence();             
    },  
    onClosed: function ( message ) {},         //连接关闭回调
    onTextMessage: function ( message ) {},    //收到文本消息
    onEmojiMessage: function ( message ) {},   //收到表情消息
    onPictureMessage: function ( message ) {}, //收到图片消息
    onRoster: function ( message ) {},         //处理好友申请
    onInviteMessage: function ( message ) {},  //处理群组邀请
    onOnline: function () {},                  //本机网络连接成功
    onOffline: function () {},                 //本机网络掉线
    onError: function ( message ) {},          //失败回调
    onReceivedMessage: function(message){},    //收到消息送达服务器回执
    onDeliveredMessage: function(message){},   //收到消息送达客户端回执
    onReadMessage: function(message){},        //收到消息已读回执
  // ......
})

注册

根据用户名/密码/昵称注册环信IM

let options = {
     username: 'username',
     password: 'password',
    nickname: 'nickname',
    appKey: WebIM.config.appkey,
    success: function () { },  
    error: function () { }, 
    apiUrl: WebIM.config.apiURL
};
WebIM.utils.registerUser(options);

登录

用户名/密码登录

let options = { 
  apiUrl: WebIM.config.apiURL,
  user: 'username',
  pwd: 'password',
  appKey: WebIM.config.appkey
};
WebIM.conn.open(options);

使用Token登录

let options = {
    apiUrl: WebIM.config.apiURL,
    user: 'username',
    accessToken: 'token',
    appKey: WebIM.config.appkey
};
WebIM.conn.open(options);

发送消息

let id = WebIM.conn.getUniqueId();
let msg = new WebIM.message(msgType, id);
msg.set({
    msg: 'userMessage',
    from: 'username',
    to: 'username',
    roomType: false,
    chatType: chatType,
    success(id, serverMsgId){}
});
WebIM.conn.send(msg.body);

退出

WebIM.conn.close();

小程序 SDK API 文档

微信小程序的IM的API使用方法，与Web Javascript接入方式基本相同，可参照Web SDK 接口列表