微信小程序集成环信sdk介绍

环信小程序SDK简介

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

功能说明

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

开发者集成

集成前准备

注册并创建应用

搭建小程序开发环境

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

配置服务器域名

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

将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 接口列表

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 230,321评论 6 543
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 99,559评论 3 429
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 178,442评论 0 383
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 63,835评论 1 317
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 72,581评论 6 412
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 55,922评论 1 328
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 43,931评论 3 447
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 43,096评论 0 290
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 49,639评论 1 336
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 41,374评论 3 358
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 43,591评论 1 374
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 39,104评论 5 364
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 44,789评论 3 349
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 35,196评论 0 28
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 36,524评论 1 295
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 52,322评论 3 400
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 48,554评论 2 379

推荐阅读更多精彩内容