环信 Web IM SDK 为PC/移动 Web 应用,提供完善的即时通信功能开发能力,屏蔽其内部复杂细节,对外提供较为简洁的 API 接口,方便第三方应 用快速集成即时通信功能。

注意:如果您是 Web SDK 的新用户,请参考本文档集成最新版本。 新版的 SDK 保证兼容旧版sdk的所有接口,同时提供了一些新的接口,所以 新版的 SDK 可以直接替换旧版的 SDK ,如果您已集成 V1.1.1,并希望再次了解其集成方式,可参考Web SDK V1.1.1 集成说明

Easemob Web IM SDK 已支持如下功能:

  • SDK 本身已支持 IE9+、FireFox10+、Chrome54+、Safari6+ 之间文本、表情、图片、音频、地址消息相互发送。
  • SDK 支持 Web 端之间,Web 端与 Android/iOS 端相互添加、删除好友功能。
  • SDK 支持与 iOS、Android SDK 之间相互发送文本、表情、图片、音频、地址消息。
  • SDK 对于消息的处理方式如下:
    1. 文本、表情消息,直接发送、接收。
    2. 附件消息(图片、音频、文件等),SDK 上传附件到服务器,然后发送附件基本信息(发送方上传的附件 URL、文件名等),接收方根据附件的 URL、secret 和自身的登录信息,以流的形式从服务器上下载到本地处理。
  • 提供 Demo,方便大家参考,已实现聊天、添加/删除好友、群组管理、黑名单、音视频功能。备注:
    1. Demo 默认支持的图片消息格式:PNG、JPG、BMP、GIF
    2. Demo 默认支持的音频消息格式:MP3、AMR、WMV
    3. Demo 默认支持的文件消息格式:zip、txt、doc、PDF

环信 Web IM Demo 展示了怎样使用环信 Web IM SDK 快速创建一个完整的类似微信的网页聊天示例。展示的功能包括:

  • 登录、登出、操作好友、收发个人消息/群组消息等
  • 分页查看公开群,根据 id 搜索公开群
  • 好友之间可以通过 webrtc 进行视频聊天(仅支持 https + Webkit 浏览器)
  • 支持同一账号最多8个标签页登录(需要联系商务经理开通多设备登陆功能,增值服务)
  • http 访问加入 ip 策略功能,防止 DNS 劫持(isHttpDNS:true
  • Web IM Demo 支持移动设备布局
  • Web IM Demo 支持浏览器本地缓存(IndexDB)

环信 Web IM demo 源代码已在 GitHub 上开源react版 vue版,以帮助开发者更好的学习了解环信 SDK。

Demo 使用 react 框架,支持 Microsoft Edge、Chrome54+、Firefox 等高级浏览器。SDK 支持 IE9+ 。视频通话功能只支持https+Webkit 浏览器。

Web IM Demo 及 SDK 目录简要说明:

  • Demo:demo 独立项目。包括脚本、样式、语言包、Appkey 配置文件(/demo/src/config/WebIMConfig.js)、package.json等
  • SDK:文件夹下包括:IM SDK webimSDK、单人音视频SDK EMedia_x1v1、多人音视频SDK EMedia_sdk-dev。
  • simpleDemo: 一个简单demo,提供api最直接的调用示例。

环信 Web IM SimpleDemo 一个简单的页面集中体现了Web IM SDK 的 API的调用,相比Web IM Demo没有业务场景,但API调用更加清晰直接。 Web IM SimpleDemo 支持IE9+

  • 简单demo提供最简单的集成sdk方式,可以直接调用api进行测试,兼容绝大部分浏览器(ie9+)
  • sdk文件夹下webimSDK为即时通讯sdk, EMedia _x1v1为单人音视频sdk, EMedia_ sdk-dev为多人音视频sdk,同时EMedia_ x1v1依赖webimSDK, 音视频必须用https
  • WeblMConfig为webimSDK所以需要的配置文件, cert.pem、 key.pem为起https服务需要的证书

运行

  • npm install http-server
  • http-server / http-server -S
  • 用浏览器打开服务器地址

Web IM SDk:

  • IE9+

Web IM Demo:

  • Web IM H5 支持所有现代浏览器,支持手机微信和 QQ。
  • 目前暂不支持 IE6-11,只支持 Microsoft Edge。

Web IM SimpleDemo:

  • IE9+

注:所有开发调试环境均基于 Mac。

参考:环信知识库

还有疑问,不知如何处理?

1. 去工单系统提问题

2. 工单描述应该包括并不仅限于以下信息

  • 您的页面访问地址?
  • 提供一下您的 webim.config.js 中的 apiUrl、xmppUrl、appKey 和您的测试登录账号密码?
  • 您的页面的连接是否正常建立,onOpen 的监听操作是否触发?
  • 提供一下所有控制台的日志信息(如何开启控制台见下图)

开启控制台以 Chrome 为例

开启Chrome控制台


上一章:iOS客户端集成

下一页:集成方式