1
评论
顶 【直播回顾】华为云×环信，强强联手实现用户增长，降本增效加快企业转型！
开发讨论 • beyond 发表了文章 • 420 次浏览 • 2021-01-29 16:56
1月28日晚上19:00，华为云云市场新生态直播邀请到环信产品总监王璨老师，以《浅谈增长秘籍：看APP如何利用IM云拉新促活》为题做了分享，他提到互联网的特点是以用户为中心，企业要靠不断提升客户体验，帮助客户“定义”产品，累积形成用户规模优势，从而形成突破性增长。同时结合环信即时通讯云和客服云详细讲解了用户增长、利用IM做拉新促活、降本增效的具体方法及策略，也分享了环信联合华为云助力企业数字化转型的成功实践，现在让我们来一起回顾一下要点吧！
王璨总监在直播中谈到，环信一共有两条主要产品线——即时通讯云及客服云，在用户增长方面，环信结合产品给出了有竞争力的解决方案。
首先是关于APP增长之分析。当前企业营销运营环节中遇到的突出问题包括流量红利褪去，公域流量获取成本高等，疫情之下，企业加快了数字转型，需要严格控制投入产出比，所以如何获取私域流量成了众多企业能否良好生存及发展的关键因素。
结合当前微信生态，微信私域流量的红利也终将褪去，企业触达用户的渠道更加分散，针对此，环信推出即时通讯云帮助客户打造全渠道的私域流量运营体系，在用户获取方面使用5G富媒体消息、邮件、外呼机器人等工具主动触达，利用微信公众号、小程序、客服等进行公域流量转化，获取用户后，及时与用户建立连接并激活。
在智能客服助力企业降本增效方面，环信推出智能客服机器人和外呼机器人，极大的节省了人力成本，提升客服效率。
根据目前产品，王璨老师也深入分析了环信是如何利用IM云拉新促活，使用客服云降本增效。
环信即时通讯云（IM）将资源部署在华为云上，利用多集群的方案，为客户提供更稳定、更高等级的服务，基于国内开发者客户需求，提供深度优化的SDK。同时环信即时通讯云产品提供包括直播、视频会议、语音连麦聊天室、小程序、小游戏、企业内部IM、智能硬件等多种解决方案。
环信客服云（CEC）提供全渠道互动与全媒体接入，来自不同媒体的服务请求均可以统一接入，一键回复。帮助用户打造跨网、跨界、跨平台的极致客户体验。
环信智能问答机器人为用户降低人工成本，通过大量数据消息训练机器人，优化参数，最终提升工作效率；外呼机器人系统结合云呼叫中心，呼出频率远高于人工；同时环信客服云提供视频客服，全平台支持、灵活接入，极大提升用户使用体验；统一融合智慧工单，不仅能实现工单的有效整合和高效流转，更能快速发现产品功能缺失，提升内部运营效率；提供开放平台能力，可以通过自由组合实现客户的个性化客服需求。
环信即时通讯云及客服云产品通过了华为云相关安全认证，将服务部署在华为云上，稳定性和技术支持能够得到保障，多年来与众多行业头部企业合作，在跨境电商、在线教育、医疗、制造、金融、智能硬件等行业都有成功实践！
获取更多详情请点击https://0x7.me/NaqQm，进入华为云云市场直播间观看精彩回放！ 查看全部
王璨总监在直播中谈到，环信一共有两条主要产品线——即时通讯云及客服云，在用户增长方面，环信结合产品给出了有竞争力的解决方案。
首先是关于APP增长之分析。当前企业营销运营环节中遇到的突出问题包括流量红利褪去，公域流量获取成本高等，疫情之下，企业加快了数字转型，需要严格控制投入产出比，所以如何获取私域流量成了众多企业能否良好生存及发展的关键因素。
结合当前微信生态，微信私域流量的红利也终将褪去，企业触达用户的渠道更加分散，针对此，环信推出即时通讯云帮助客户打造全渠道的私域流量运营体系，在用户获取方面使用5G富媒体消息、邮件、外呼机器人等工具主动触达，利用微信公众号、小程序、客服等进行公域流量转化，获取用户后，及时与用户建立连接并激活。
在智能客服助力企业降本增效方面，环信推出智能客服机器人和外呼机器人，极大的节省了人力成本，提升客服效率。
根据目前产品，王璨老师也深入分析了环信是如何利用IM云拉新促活，使用客服云降本增效。
环信即时通讯云（IM）将资源部署在华为云上，利用多集群的方案，为客户提供更稳定、更高等级的服务，基于国内开发者客户需求，提供深度优化的SDK。同时环信即时通讯云产品提供包括直播、视频会议、语音连麦聊天室、小程序、小游戏、企业内部IM、智能硬件等多种解决方案。
环信客服云（CEC）提供全渠道互动与全媒体接入，来自不同媒体的服务请求均可以统一接入，一键回复。帮助用户打造跨网、跨界、跨平台的极致客户体验。
环信智能问答机器人为用户降低人工成本，通过大量数据消息训练机器人，优化参数，最终提升工作效率；外呼机器人系统结合云呼叫中心，呼出频率远高于人工；同时环信客服云提供视频客服，全平台支持、灵活接入，极大提升用户使用体验；统一融合智慧工单，不仅能实现工单的有效整合和高效流转，更能快速发现产品功能缺失，提升内部运营效率；提供开放平台能力，可以通过自由组合实现客户的个性化客服需求。
环信即时通讯云及客服云产品通过了华为云相关安全认证，将服务部署在华为云上，稳定性和技术支持能够得到保障，多年来与众多行业头部企业合作，在跨境电商、在线教育、医疗、制造、金融、智能硬件等行业都有成功实践！
获取更多详情请点击https://0x7.me/NaqQm，进入华为云云市场直播间观看精彩回放！ 查看全部
1月28日晚上19:00，华为云云市场新生态直播邀请到环信产品总监王璨老师，以《浅谈增长秘籍：看APP如何利用IM云拉新促活》为题做了分享，他提到互联网的特点是以用户为中心，企业要靠不断提升客户体验，帮助客户“定义”产品，累积形成用户规模优势，从而形成突破性增长。同时结合环信即时通讯云和客服云详细讲解了用户增长、利用IM做拉新促活、降本增效的具体方法及策略，也分享了环信联合华为云助力企业数字化转型的成功实践，现在让我们来一起回顾一下要点吧！
王璨总监在直播中谈到，环信一共有两条主要产品线——即时通讯云及客服云，在用户增长方面，环信结合产品给出了有竞争力的解决方案。
首先是关于APP增长之分析。当前企业营销运营环节中遇到的突出问题包括流量红利褪去，公域流量获取成本高等，疫情之下，企业加快了数字转型，需要严格控制投入产出比，所以如何获取私域流量成了众多企业能否良好生存及发展的关键因素。
结合当前微信生态，微信私域流量的红利也终将褪去，企业触达用户的渠道更加分散，针对此，环信推出即时通讯云帮助客户打造全渠道的私域流量运营体系，在用户获取方面使用5G富媒体消息、邮件、外呼机器人等工具主动触达，利用微信公众号、小程序、客服等进行公域流量转化，获取用户后，及时与用户建立连接并激活。
在智能客服助力企业降本增效方面，环信推出智能客服机器人和外呼机器人，极大的节省了人力成本，提升客服效率。
根据目前产品，王璨老师也深入分析了环信是如何利用IM云拉新促活，使用客服云降本增效。
环信即时通讯云（IM）将资源部署在华为云上，利用多集群的方案，为客户提供更稳定、更高等级的服务，基于国内开发者客户需求，提供深度优化的SDK。同时环信即时通讯云产品提供包括直播、视频会议、语音连麦聊天室、小程序、小游戏、企业内部IM、智能硬件等多种解决方案。
环信客服云（CEC）提供全渠道互动与全媒体接入，来自不同媒体的服务请求均可以统一接入，一键回复。帮助用户打造跨网、跨界、跨平台的极致客户体验。
环信智能问答机器人为用户降低人工成本，通过大量数据消息训练机器人，优化参数，最终提升工作效率；外呼机器人系统结合云呼叫中心，呼出频率远高于人工；同时环信客服云提供视频客服，全平台支持、灵活接入，极大提升用户使用体验；统一融合智慧工单，不仅能实现工单的有效整合和高效流转，更能快速发现产品功能缺失，提升内部运营效率；提供开放平台能力，可以通过自由组合实现客户的个性化客服需求。
环信即时通讯云及客服云产品通过了华为云相关安全认证，将服务部署在华为云上，稳定性和技术支持能够得到保障，多年来与众多行业头部企业合作，在跨境电商、在线教育、医疗、制造、金融、智能硬件等行业都有成功实践！
获取更多详情请点击https://0x7.me/NaqQm，进入华为云云市场直播间观看精彩回放！
王璨总监在直播中谈到，环信一共有两条主要产品线——即时通讯云及客服云，在用户增长方面，环信结合产品给出了有竞争力的解决方案。
首先是关于APP增长之分析。当前企业营销运营环节中遇到的突出问题包括流量红利褪去，公域流量获取成本高等，疫情之下，企业加快了数字转型，需要严格控制投入产出比，所以如何获取私域流量成了众多企业能否良好生存及发展的关键因素。
结合当前微信生态，微信私域流量的红利也终将褪去，企业触达用户的渠道更加分散，针对此，环信推出即时通讯云帮助客户打造全渠道的私域流量运营体系，在用户获取方面使用5G富媒体消息、邮件、外呼机器人等工具主动触达，利用微信公众号、小程序、客服等进行公域流量转化，获取用户后，及时与用户建立连接并激活。
在智能客服助力企业降本增效方面，环信推出智能客服机器人和外呼机器人，极大的节省了人力成本，提升客服效率。
根据目前产品，王璨老师也深入分析了环信是如何利用IM云拉新促活，使用客服云降本增效。
环信即时通讯云（IM）将资源部署在华为云上，利用多集群的方案，为客户提供更稳定、更高等级的服务，基于国内开发者客户需求，提供深度优化的SDK。同时环信即时通讯云产品提供包括直播、视频会议、语音连麦聊天室、小程序、小游戏、企业内部IM、智能硬件等多种解决方案。
环信客服云（CEC）提供全渠道互动与全媒体接入，来自不同媒体的服务请求均可以统一接入，一键回复。帮助用户打造跨网、跨界、跨平台的极致客户体验。
环信智能问答机器人为用户降低人工成本，通过大量数据消息训练机器人，优化参数，最终提升工作效率；外呼机器人系统结合云呼叫中心，呼出频率远高于人工；同时环信客服云提供视频客服，全平台支持、灵活接入，极大提升用户使用体验；统一融合智慧工单，不仅能实现工单的有效整合和高效流转，更能快速发现产品功能缺失，提升内部运营效率；提供开放平台能力，可以通过自由组合实现客户的个性化客服需求。
环信即时通讯云及客服云产品通过了华为云相关安全认证，将服务部署在华为云上，稳定性和技术支持能够得到保障，多年来与众多行业头部企业合作，在跨境电商、在线教育、医疗、制造、金融、智能硬件等行业都有成功实践！
获取更多详情请点击https://0x7.me/NaqQm，进入华为云云市场直播间观看精彩回放！
2
评论
顶 环信大学：2021漫游指南，PC Web、Uni-App、小程序集成环信IM都在这里了
开发者管理后台 讨论区 • beyond 发表了文章 • 717 次浏览 • 2021-01-07 12:49
与其说这是一篇集成攻略，其实这更多是对于官网文档的一篇解释说明，相信很多的小伙伴在准备将环信的IM即时通讯能力集成或移植在自己的项目上都会出现一头雾水或无从下手的感觉，即使看遍了官方文档也不免心生疑问：
“啥？！啥？！啥？！这是啥？！文档写的是个啥？！”
所以我决定更加直白且详细的描述一下如何集成web端的IM SDK，（小程序、Uni-app通用）以下是概览：
一、 注册环信console，创建自己的应用，拿到Appkey。
二、 粗略浏览官方文档，熟悉大致流程及接口。
三、 Clone Demo，挑出必选引入文件。
四、 Hello World! （从注册登陆开始）。
常见问题以及error报错查询入口：
http://docs-im.easemob.com/faq
http://docs-im.easemob.com/im/other/errorcode/web
http://docs-im.easemob.com/im/ ... stapi
以下为较为详细的描述一些集成步骤，如一些步骤已非常了解且已操作完成请自行跳过。
一、注册环信console，创建自己的应用，拿到Appkey
PS:这一步骤，各端通用。
1. 注册console 管理后台
相信经常使用第三方服务的小伙伴都非常熟悉这一步（不熟悉？没关系，照着葫芦画瓢就行），打开开发者平台进行注册登录创建等操作，这一点我就不过多赘述，直接上注册平台链接：https://console.easemob.com/user/login
注册成功之后会跳转到这样的一个界面：
这个就是console后台管理页面，这个实际就属于一个后台管理系统，创建自己的项目应用，监测日活，统计注册用户数，常见的一些增删改查操作都可以执行，没事可以捣鼓捣鼓看看有哪些功能，这里我就不多介绍了，咱们接着往下进行。
2. 创建应用
创建应用这一步搁咱们JavaScript其实可以理解为 new 了一个空对象，var了一个空变量等等随意怎么比喻都可以。如果放在现实当中其实更像是创建了一个公司，这个公司有公司名也就是Appname,而每个公司肯定有一个唯一的公司代码（公司的身份证ID号），也就是Appkey。公司人数也就是创建出来的应用下注册的用户数量等等。
点击添加应用开始创建：
创建应用的详情页：
这里我特意框住是因为经常有人告诉我：“创建出来的appkey在客户端测试时候点击注册没法注册，报错描述是401无权限是怎么回事？”
最后发现是创建应用的时候注册模式选的是授权注册，你选个授权注册，看眼描述就知道这种注册模式相当于注册是要经过审批的，如果测试阶段可以使用开放注册，后期还可以修改注册模式。
这个是创建成功之后点击进入应用的基本信息描述，分别对应的是什么功能也有描述，Appkey也就成功拿到了，由orgname +“#”+appname组成的appkey。如图：
这里特别说下这个Client ID和Client Secret ，有了Client ID和Client Secret就可以获取到管理员token从而可以在应用下随意增删改查，发消息，之前有遇到泄露导致客户端用户莫名其妙收到一些骚扰信息，当然这都算轻的，所以正式环境下一定要保管好Client ID和Client Secret ！！！
二、粗略浏览官方文档，熟悉大致流程及接口
PS：这一步骤，各端通用
可能有的小伙伴觉得这一步我再拉出来讲意义不是很大没什么用，其实不然，因为在协助一些小伙伴集成SDK中发现有的朋友对于在自己项目中要用到的接口都还不知道在哪，更谈不上如何使用。文档通篇一字不落看下来也不太现实，但是大致知道一些后期咱们的项目中有哪些接口可能会用到，知道大概在哪能找到调用方式还是很有必要的。
一篇文档中我们可以从这些方向看：
SDK功能分类，更新日志（了解SDK更新周期，新增功能，修复问题），Demo的使用介绍，兼容性以及常见问题。
Uni-app打包双端的介绍，运行平台描述，源码的GitHub地址。
而且文档中也有描述一些可能会遇到的坑，一些解决方案。例如：发送URL类型的图片消息需要在config配置文件中配置。
通过“WebIM.conn.mr_cache = ”方法可以重置拉取历史消息的游标。
常用的新消息提示如何去处理，等等都会有一些描述，磨刀不误砍柴工，因此我强烈建议各位在正式开始集成之前首先浏览一下咱们对应端的文档。
在此我也正好有几个常用的功能场景提供给大家，文档中有介绍，为了方便各位也还是直接上链接。
消息回执（涉及到web端已读未读的处理）：
http://docs-im.easemob.com/im/ ... %25A7
消息漫游（涉及到web端拉取历史SDK接口）：
http://docs-im.easemob.com/im/ ... %25B8
昵称与头像（涉及到昵称与头像的处理）：
http://docs-im.easemob.com/im/ ... kname
获取管理员token（一些服务端rest接口的调用需获取管理员token）：
http://docs-im.easemob.com/im/ ... %2590
拉取历史消息文件（将聊天产生的历史消息保存到本地服务器）：
http://docs-im.easemob.com/im/ ... %25B6
更多常用实现场景可以参考文档常见方案一栏，里面可能有些只有IOS 和 Android 解决方案，但是web端实际也是相似的处理方式，瞜一眼相信会有些启发。
http://docs-im.easemob.com/im/ ... troom
文档已浏览完毕，接着往下进行。
三、Clone Demo、挑选出必要文件
其实这一步主要面向于直接下载了官网Demo，但是不知道如何把将Demo往里引入的同学，在协助集成的过程中，我经常遇到有些朋友启动Demo测试完成之后，直接就把所有Demo文件拷贝到了原有项目当中，我们知道前端的部署打包的性能优化是与压缩精简代码，减少请求数量，页面结构，浏览器缓存等因素是相关的，我并不建议完全将Demo拷贝到咱们的原项目当中。
首先我想说下现有PCweb-Demo uni-appDemo 微信小程序Demo等Demo 的意义是为我们开发者小伙伴展示功能接口的实际运用，即时通讯能力的接口测验，各接口组合使用的运用逻辑及调用顺序 ，当然更是给了咱们在实际项目开发当中有了一定的参考作用。由于其功能性的考虑并没有按照线上产品的标准去做，所以其代码内部接口中有些接口的调用以及请求并未考虑性能因素，功能并未完全实现展示。
相信通过我的描述，也就明白了为什么不建议将Demo完全拷贝到原有项目中，因为可能会对咱们的性能优化造成一定的影响，并且可能会有很多代码对项目中的功能实现并无任何帮助，有些组件关联，运行可能会有更多难以排查的报错，更多是建议可以参考一下Demo当中的写法。
下面我先介绍一下uni-app-Demo集成 IMSDK的操作：
Uni-App-Demo GitHub地址：
https://github.com/easemob/webim-uniapp-demo
1. 将clone下来Demo于HbuilderX中打开，首先咱们不急着运行先了解一下目录下各个文件的作用。
<!-- 截图来自uni-appDemo中的README.md文件，详细可以自行查看 -->
2. 将核心文件导入到自己的测试项目或正式项目中。
随着环信3.x IM SDK的更新，现在引入依赖文件相对之前2.x IM SDK的集成引数个文件无疑是简单了许多。
Uni-app-Demo中需要引用的文件截图：
其实除SDK必须引入之外，WebIMConfig.js 以及WebIM.js也可以不引用，但是在项目中必须要存在，听起来很矛盾，但实际含义就是WebIMConfig.js该有的配置你必须要配置，WebIM.js中的初始化这一步你也必须要进行初始化，至于你要命名为其他文件名，放在其他位置也不是不可以的。
SDK包：PCWeb端：websdk3.x.js 小程序/Uni-app：wxsdk3.x.js
WebIMConfig.js：这个文件的作用就是将引入的WebIMSDK进行自定义配置：
如图文档上有对各个配置项的作用详细介绍，建议在集成过程中的配置页可以参考Demo中的配置进行配置，但是各个配置项的开启与否，参数设置请自行按需设置。
依然是在协助小伙伴集成环信IM的过程经常会遇到有小伙伴问配置项中的：“socket Server地址：socketServer: '//im-api-v2.easemob.com/ws', // ”和“rest Server地址：restServer: '//a1.easemob.com' ”，“需不需要配置成自己项目地址，或者自己去定义这两个参数？”，对于这个问题，我只能回答说千万别！这个是定义好了的，你要做的基本就只需要将appkey：改成自己申请的，其他几乎不用动。
WebIM.js：将SDK的配置以及引入的SDK进一步做处理简称：初始化。
导出SDK 并引入WebIMConfig.js文件,将SDK重命名为WebIM挂载到window或uni或wx下，视情况决定。
同样这一步文档也有详细的描述：
3. 完成文件导入挂载，开始配置并添加监听回调。
如图，监听仅截图一部分：
在集成Web端（包括小程序以及Uni-app）IM中，所有的事件监听都是要靠WebIM.conn.listen( )，由此可以看出其重要性。
所以在初始化阶段结束后我们首要将监听配置添加上。
至于监听的具体位置应该添加在哪里这个实际并没有严格的要求，PCwebDemo中是将监听写在了WebIM.js中，微信小程序Demo是将监听写在了app.js，uni-app是将监听写在了App.vue根组件中，多数是写在了全局。但其实监听也可以写在局部，前提局部能够访问到WebIM，然后在局部添加上监听回调，不管是全局监听还是局部监听都要在SDK接口调用之前布置好监听并开启监听。
下面我们再来聊一下监听中的个别监听回调的作用以及实际运用，其监听的作用文档已有详细描写且较为好了解，这里就不再一一赘述。
onOpened: function ( ) {}, //连接成功回调
此监听为与环信连接成功之后触发的监听回调，经常会出现一个问题就是明明环信conn.open登陆接口都已经返回success都已经返回token了，可是发送消息依然报错，接收消息也接收不到。那么我们首要检查的就是该监听有没有触发，放个console.log( )看下登陆之后的该回调有没有成功的打印，如果打印了那么说明成功与环信建立了连接！也就可以进行其他的操作了。
经常有朋友问：“登陆成功之后打印message形参为什么是undefined?是不是登陆有问题？”，其实不是这个message并不会有任何返回，登陆是否成功一切以onOpened监听回调是否执行为准！
在该监听的实际运用中Demo中其实也做了很好的演示，就是登陆之后的页面跳转，这个非常常用，因为IM聊天功能是否可以使用首要的判断必然是与环信是否建立连接成功，成功那么跳转进入聊天页面。
onClosed: function ( message ) {}, //连接关闭回调
此监听为与环信连接关闭的监听回调，其实也没有具体要描述的地方，更多的是该监听经常用来处理在与环信断开连接时候的一些UI层面的提示，或者再意外断开连接之后退回到login页面，以及有些场景下进行手动重连。
onMessage：function ( message ) {}, //监听收到消息的回调
这里的onMessage是对所有收到消息的回调的一个简称，例如：onTextMessage 监听文本消息、onPictureMessage 监听图片消息、onAudioMessage 监听音频消息，等等... 这个监听相信不用过多描述就可以清楚其功能，消息监听回调非常的核心，所有的消息都是仰仗这几个监听回调拿到的。测试的时候可以在监听回调中定义形参并控制台打印参数查看消息监听是否正常触发并接收数据。
截图为onTextMessage监听收到的单聊消息
onError: function ( message ) {}, //失败回调
此监听回调可监听SDK中大多数的error抛出，在集成开发过程中帮助更快定位问题原因，并且可在回调中根据error信息从UI层面进行提示，因此其实际运用相对也常用。
截图为Uni-appDemo利用onError监听做出的提示以及一些操作。
当然有些error出现之后大家可能不知道其具体含义下面为分析一下error异常的判断思路，
首先onError监听回调的message字段就已经给出了大致error原因：
例图中onError回调返回的对象中的message字段value的值中给出了“login failed”登陆异常，接着我们看data字段下给出的具体原因，不难看出invalid password 不打开百度翻译也能猜出密码有问题，那么我们也就可以以此判断，登陆密码错误，或者对用户做出弹窗提示。
同样的type：1,同样的message：“login failed”，error详情就又不一样了，error介绍：“user not found” 用户找不到，所以具体的判断error原因还是要以data下的error_description给出的原因去定位。
当然有些error也会出现一些其他的情况，并不返回message 参数，data也是空的，只给出了一个type类型，像这种情况其实就是在没有登陆的情况下调用了SDK接口，那么这时首先要判断的就是是否登录了环信，或者已经登陆但是又断开了与环信的连接。
截图为未登录调用了获取群组详情返回的error。
在已登录的情况下查询群组详情，error详情直接给出了找不到 group ID为XXXXXX的群组，此时就可以以此判断，或给出提示查找不到群ID为...的详情
onPresence: function ( message ) {}, //处理“广播”或“发布-订阅”消息，如联系人订阅请求、处理群组、聊天室被踢解散等消息。
此监听正如描述所讲，处理“广播”或“发布-订阅消息”，至于发布-订阅消息可以去了解一下设计模式，发布订阅者模式，这里就不再进行解释了，这里主要讲的是该监听如果在实际运用中的作用是什么。
我们先看下Uni-appDemo中的示例：
通过观察我们看到了示例中运用到了switch case 语句通过回调里message中不同的type类型从而对应执行不同的提示或其他逻辑操作。
在实际SDK集成过程中，例如：“申请添加好友、删除好友，邀请入群，他人退群，新增群组管理员、他人加入聊天室，退出聊天室”等操作均会触发此监听的执行并回调出对应行为类型的type字段，根据type类型我们从而可以给出对应的UI层面的提示，或发布-订阅事件，uni-appDemo中的disp.fire(‘XXXX’),正是发布-订阅模式中的发布事件。
如果我们需要详细的类型，则可以在文档中的事件监听找到：
好友状态事件监听：
现有的好友事件监听，已新增对应的回调监听：
群组事件监听：
文档地址：
http://docs-im.easemob.com/im/ ... %25AC
聊天室事件监听：
文档地址：
http://docs-im.easemob.com/im/ ... %25AC
以上变为常用的几个监听的介绍，具体的使用还是以咱们实际项目中的逻辑为准。
SDK，config配置，以及初始化，监听都已配置完毕，下面我们就开始注册、登陆环信ID，发出我们的第一条消息吧！
四、Hello World ! (从注册登录开始)
环信所有的功能性SDK接口调用都是要从注册及登陆成功方可有效使用，如已注册，登陆则是客户端调用的第一个接口。
下面我将从注册接口开始讲起：
注册，web端注册接口如图：
客户端是否能够直接调用注册接口，需要先去环信IM管理后台检查该Appkey的注册模式是否为开放注册，授权模式的话，此接口调用注册会直接出现下图情况
Open registration doesn't allow, so register user need token
开放注册不允许，所以注册用户需要token
注册成功会触发注册接口中的success回调,并有注册信息的返回如图：返回字段包含创建时间，appname，orgname等信息。
注册完成之后便可以开始调用登陆接口完成登录操作。
下面我们来了解SDK提供的两种登陆方式：
1. 用户名密码登陆（环信ID、密码登陆），截图为文档——登陆接口：
user: String //环信ID
pwd：String //注册时的密码
appKey // appkey 初始化后appkey
2. token登陆（使用token进行免密登陆）
该登陆方式可以进行免密登陆，常见用于刷新页面之后的二次登陆。
比较常用到的场景，例如从login页面跳转到chat页面，用户在当前页面刷新之后不再进行login页面登陆直接正常进行聊天。（刷新页面是会断开与环信的连接，如不登陆则无法调用SDK接口）。
token获取：token的获取是在用户名密码登陆成功后的success回调中返回获取。
access_token字段为token。
expires_in字段为token有效期，单位为秒，有效期内token可重复使用。
uni-app-demo中的用户名密码登陆的接口调用
Uni-app-demo中的token登陆：
有时我们会遇到success成功的返回了token，可是发送消息或者调用其他接口还是会出现报错，或者提示未登录的error，这时我们首要排查的情况还是检查一下onOpened监听是否成功触发，与环信的连接建立还是要以onOpened监听触发为准！
监听成功打印，意味着登陆成功！
这里顺便给大家两个检验是否登录的方法。
1. WebIM.conn方法下有一个logOut字段，该字段为true时表明未登录状态，该字段为false时表明登陆：
2. WebIM.conn.isOpened () 方法有三个状态，undefined为未登录状态，true为已登录状态，false为未登录状态，可以根据这三个状态去判断是否登录：
到这里登陆就说完了，至于为什么没有讲下去也是因为只要登录成功，其他接口就可以按需调用，相信以各位小伙伴的能力接着往下进行也不是很困难了，当然也说不定有些奇葩问题搞不定，那么建议咱们可以去环信官网去寻求我们支持同事的帮助，将遇到的问题描述清楚，问题将在24H以内得到回复。
最后愿JavaScript之父布兰登·艾克
保佑各位项目顺利上线！ 查看全部
“啥？！啥？！啥？！这是啥？！文档写的是个啥？！”
所以我决定更加直白且详细的描述一下如何集成web端的IM SDK，（小程序、Uni-app通用）以下是概览：
一、 注册环信console，创建自己的应用，拿到Appkey。
二、 粗略浏览官方文档，熟悉大致流程及接口。
三、 Clone Demo，挑出必选引入文件。
四、 Hello World! （从注册登陆开始）。
常见问题以及error报错查询入口：
http://docs-im.easemob.com/faq
http://docs-im.easemob.com/im/other/errorcode/web
http://docs-im.easemob.com/im/ ... stapi
以下为较为详细的描述一些集成步骤，如一些步骤已非常了解且已操作完成请自行跳过。
一、注册环信console，创建自己的应用，拿到Appkey
PS:这一步骤，各端通用。
1. 注册console 管理后台
相信经常使用第三方服务的小伙伴都非常熟悉这一步（不熟悉？没关系，照着葫芦画瓢就行），打开开发者平台进行注册登录创建等操作，这一点我就不过多赘述，直接上注册平台链接：https://console.easemob.com/user/login
注册成功之后会跳转到这样的一个界面：
这个就是console后台管理页面，这个实际就属于一个后台管理系统，创建自己的项目应用，监测日活，统计注册用户数，常见的一些增删改查操作都可以执行，没事可以捣鼓捣鼓看看有哪些功能，这里我就不多介绍了，咱们接着往下进行。
2. 创建应用
创建应用这一步搁咱们JavaScript其实可以理解为 new 了一个空对象，var了一个空变量等等随意怎么比喻都可以。如果放在现实当中其实更像是创建了一个公司，这个公司有公司名也就是Appname,而每个公司肯定有一个唯一的公司代码（公司的身份证ID号），也就是Appkey。公司人数也就是创建出来的应用下注册的用户数量等等。
点击添加应用开始创建：
创建应用的详情页：
这里我特意框住是因为经常有人告诉我：“创建出来的appkey在客户端测试时候点击注册没法注册，报错描述是401无权限是怎么回事？”
最后发现是创建应用的时候注册模式选的是授权注册，你选个授权注册，看眼描述就知道这种注册模式相当于注册是要经过审批的，如果测试阶段可以使用开放注册，后期还可以修改注册模式。
这个是创建成功之后点击进入应用的基本信息描述，分别对应的是什么功能也有描述，Appkey也就成功拿到了，由orgname +“#”+appname组成的appkey。如图：
这里特别说下这个Client ID和Client Secret ，有了Client ID和Client Secret就可以获取到管理员token从而可以在应用下随意增删改查，发消息，之前有遇到泄露导致客户端用户莫名其妙收到一些骚扰信息，当然这都算轻的，所以正式环境下一定要保管好Client ID和Client Secret ！！！
二、粗略浏览官方文档，熟悉大致流程及接口
PS：这一步骤，各端通用
可能有的小伙伴觉得这一步我再拉出来讲意义不是很大没什么用，其实不然，因为在协助一些小伙伴集成SDK中发现有的朋友对于在自己项目中要用到的接口都还不知道在哪，更谈不上如何使用。文档通篇一字不落看下来也不太现实，但是大致知道一些后期咱们的项目中有哪些接口可能会用到，知道大概在哪能找到调用方式还是很有必要的。
一篇文档中我们可以从这些方向看：
SDK功能分类，更新日志（了解SDK更新周期，新增功能，修复问题），Demo的使用介绍，兼容性以及常见问题。
Uni-app打包双端的介绍，运行平台描述，源码的GitHub地址。
而且文档中也有描述一些可能会遇到的坑，一些解决方案。例如：发送URL类型的图片消息需要在config配置文件中配置。
通过“WebIM.conn.mr_cache = ”方法可以重置拉取历史消息的游标。
常用的新消息提示如何去处理，等等都会有一些描述，磨刀不误砍柴工，因此我强烈建议各位在正式开始集成之前首先浏览一下咱们对应端的文档。
在此我也正好有几个常用的功能场景提供给大家，文档中有介绍，为了方便各位也还是直接上链接。
消息回执（涉及到web端已读未读的处理）：
http://docs-im.easemob.com/im/ ... %25A7
消息漫游（涉及到web端拉取历史SDK接口）：
http://docs-im.easemob.com/im/ ... %25B8
昵称与头像（涉及到昵称与头像的处理）：
http://docs-im.easemob.com/im/ ... kname
获取管理员token（一些服务端rest接口的调用需获取管理员token）：
http://docs-im.easemob.com/im/ ... %2590
拉取历史消息文件（将聊天产生的历史消息保存到本地服务器）：
http://docs-im.easemob.com/im/ ... %25B6
更多常用实现场景可以参考文档常见方案一栏，里面可能有些只有IOS 和 Android 解决方案，但是web端实际也是相似的处理方式，瞜一眼相信会有些启发。
http://docs-im.easemob.com/im/ ... troom
文档已浏览完毕，接着往下进行。
三、Clone Demo、挑选出必要文件
其实这一步主要面向于直接下载了官网Demo，但是不知道如何把将Demo往里引入的同学，在协助集成的过程中，我经常遇到有些朋友启动Demo测试完成之后，直接就把所有Demo文件拷贝到了原有项目当中，我们知道前端的部署打包的性能优化是与压缩精简代码，减少请求数量，页面结构，浏览器缓存等因素是相关的，我并不建议完全将Demo拷贝到咱们的原项目当中。
首先我想说下现有PCweb-Demo uni-appDemo 微信小程序Demo等Demo 的意义是为我们开发者小伙伴展示功能接口的实际运用，即时通讯能力的接口测验，各接口组合使用的运用逻辑及调用顺序 ，当然更是给了咱们在实际项目开发当中有了一定的参考作用。由于其功能性的考虑并没有按照线上产品的标准去做，所以其代码内部接口中有些接口的调用以及请求并未考虑性能因素，功能并未完全实现展示。
相信通过我的描述，也就明白了为什么不建议将Demo完全拷贝到原有项目中，因为可能会对咱们的性能优化造成一定的影响，并且可能会有很多代码对项目中的功能实现并无任何帮助，有些组件关联，运行可能会有更多难以排查的报错，更多是建议可以参考一下Demo当中的写法。
下面我先介绍一下uni-app-Demo集成 IMSDK的操作：
Uni-App-Demo GitHub地址：
https://github.com/easemob/webim-uniapp-demo
1. 将clone下来Demo于HbuilderX中打开，首先咱们不急着运行先了解一下目录下各个文件的作用。
<!-- 截图来自uni-appDemo中的README.md文件，详细可以自行查看 -->
2. 将核心文件导入到自己的测试项目或正式项目中。
随着环信3.x IM SDK的更新，现在引入依赖文件相对之前2.x IM SDK的集成引数个文件无疑是简单了许多。
Uni-app-Demo中需要引用的文件截图：
其实除SDK必须引入之外，WebIMConfig.js 以及WebIM.js也可以不引用，但是在项目中必须要存在，听起来很矛盾，但实际含义就是WebIMConfig.js该有的配置你必须要配置，WebIM.js中的初始化这一步你也必须要进行初始化，至于你要命名为其他文件名，放在其他位置也不是不可以的。
SDK包：PCWeb端：websdk3.x.js 小程序/Uni-app：wxsdk3.x.js
WebIMConfig.js：这个文件的作用就是将引入的WebIMSDK进行自定义配置：
如图文档上有对各个配置项的作用详细介绍，建议在集成过程中的配置页可以参考Demo中的配置进行配置，但是各个配置项的开启与否，参数设置请自行按需设置。
依然是在协助小伙伴集成环信IM的过程经常会遇到有小伙伴问配置项中的：“socket Server地址：socketServer: '//im-api-v2.easemob.com/ws', // ”和“rest Server地址：restServer: '//a1.easemob.com' ”，“需不需要配置成自己项目地址，或者自己去定义这两个参数？”，对于这个问题，我只能回答说千万别！这个是定义好了的，你要做的基本就只需要将appkey：改成自己申请的，其他几乎不用动。
WebIM.js：将SDK的配置以及引入的SDK进一步做处理简称：初始化。
导出SDK 并引入WebIMConfig.js文件,将SDK重命名为WebIM挂载到window或uni或wx下，视情况决定。
同样这一步文档也有详细的描述：
3. 完成文件导入挂载，开始配置并添加监听回调。
如图，监听仅截图一部分：
在集成Web端（包括小程序以及Uni-app）IM中，所有的事件监听都是要靠WebIM.conn.listen( )，由此可以看出其重要性。
所以在初始化阶段结束后我们首要将监听配置添加上。
至于监听的具体位置应该添加在哪里这个实际并没有严格的要求，PCwebDemo中是将监听写在了WebIM.js中，微信小程序Demo是将监听写在了app.js，uni-app是将监听写在了App.vue根组件中，多数是写在了全局。但其实监听也可以写在局部，前提局部能够访问到WebIM，然后在局部添加上监听回调，不管是全局监听还是局部监听都要在SDK接口调用之前布置好监听并开启监听。
下面我们再来聊一下监听中的个别监听回调的作用以及实际运用，其监听的作用文档已有详细描写且较为好了解，这里就不再一一赘述。
onOpened: function ( ) {}, //连接成功回调
此监听为与环信连接成功之后触发的监听回调，经常会出现一个问题就是明明环信conn.open登陆接口都已经返回success都已经返回token了，可是发送消息依然报错，接收消息也接收不到。那么我们首要检查的就是该监听有没有触发，放个console.log( )看下登陆之后的该回调有没有成功的打印，如果打印了那么说明成功与环信建立了连接！也就可以进行其他的操作了。
经常有朋友问：“登陆成功之后打印message形参为什么是undefined?是不是登陆有问题？”，其实不是这个message并不会有任何返回，登陆是否成功一切以onOpened监听回调是否执行为准！
在该监听的实际运用中Demo中其实也做了很好的演示，就是登陆之后的页面跳转，这个非常常用，因为IM聊天功能是否可以使用首要的判断必然是与环信是否建立连接成功，成功那么跳转进入聊天页面。
onClosed: function ( message ) {}, //连接关闭回调
此监听为与环信连接关闭的监听回调，其实也没有具体要描述的地方，更多的是该监听经常用来处理在与环信断开连接时候的一些UI层面的提示，或者再意外断开连接之后退回到login页面，以及有些场景下进行手动重连。
onMessage：function ( message ) {}, //监听收到消息的回调
这里的onMessage是对所有收到消息的回调的一个简称，例如：onTextMessage 监听文本消息、onPictureMessage 监听图片消息、onAudioMessage 监听音频消息，等等... 这个监听相信不用过多描述就可以清楚其功能，消息监听回调非常的核心，所有的消息都是仰仗这几个监听回调拿到的。测试的时候可以在监听回调中定义形参并控制台打印参数查看消息监听是否正常触发并接收数据。
截图为onTextMessage监听收到的单聊消息
onError: function ( message ) {}, //失败回调
此监听回调可监听SDK中大多数的error抛出，在集成开发过程中帮助更快定位问题原因，并且可在回调中根据error信息从UI层面进行提示，因此其实际运用相对也常用。
截图为Uni-appDemo利用onError监听做出的提示以及一些操作。
当然有些error出现之后大家可能不知道其具体含义下面为分析一下error异常的判断思路，
首先onError监听回调的message字段就已经给出了大致error原因：
例图中onError回调返回的对象中的message字段value的值中给出了“login failed”登陆异常，接着我们看data字段下给出的具体原因，不难看出invalid password 不打开百度翻译也能猜出密码有问题，那么我们也就可以以此判断，登陆密码错误，或者对用户做出弹窗提示。
同样的type：1,同样的message：“login failed”，error详情就又不一样了，error介绍：“user not found” 用户找不到，所以具体的判断error原因还是要以data下的error_description给出的原因去定位。
当然有些error也会出现一些其他的情况，并不返回message 参数，data也是空的，只给出了一个type类型，像这种情况其实就是在没有登陆的情况下调用了SDK接口，那么这时首先要判断的就是是否登录了环信，或者已经登陆但是又断开了与环信的连接。
截图为未登录调用了获取群组详情返回的error。
在已登录的情况下查询群组详情，error详情直接给出了找不到 group ID为XXXXXX的群组，此时就可以以此判断，或给出提示查找不到群ID为...的详情
onPresence: function ( message ) {}, //处理“广播”或“发布-订阅”消息，如联系人订阅请求、处理群组、聊天室被踢解散等消息。
此监听正如描述所讲，处理“广播”或“发布-订阅消息”，至于发布-订阅消息可以去了解一下设计模式，发布订阅者模式，这里就不再进行解释了，这里主要讲的是该监听如果在实际运用中的作用是什么。
我们先看下Uni-appDemo中的示例：
通过观察我们看到了示例中运用到了switch case 语句通过回调里message中不同的type类型从而对应执行不同的提示或其他逻辑操作。
在实际SDK集成过程中，例如：“申请添加好友、删除好友，邀请入群，他人退群，新增群组管理员、他人加入聊天室，退出聊天室”等操作均会触发此监听的执行并回调出对应行为类型的type字段，根据type类型我们从而可以给出对应的UI层面的提示，或发布-订阅事件，uni-appDemo中的disp.fire(‘XXXX’),正是发布-订阅模式中的发布事件。
如果我们需要详细的类型，则可以在文档中的事件监听找到：
好友状态事件监听：
现有的好友事件监听，已新增对应的回调监听：
群组事件监听：
文档地址：
http://docs-im.easemob.com/im/ ... %25AC
聊天室事件监听：
文档地址：
http://docs-im.easemob.com/im/ ... %25AC
以上变为常用的几个监听的介绍，具体的使用还是以咱们实际项目中的逻辑为准。
SDK，config配置，以及初始化，监听都已配置完毕，下面我们就开始注册、登陆环信ID，发出我们的第一条消息吧！
四、Hello World ! (从注册登录开始)
环信所有的功能性SDK接口调用都是要从注册及登陆成功方可有效使用，如已注册，登陆则是客户端调用的第一个接口。
下面我将从注册接口开始讲起：
注册，web端注册接口如图：
客户端是否能够直接调用注册接口，需要先去环信IM管理后台检查该Appkey的注册模式是否为开放注册，授权模式的话，此接口调用注册会直接出现下图情况
Open registration doesn't allow, so register user need token
开放注册不允许，所以注册用户需要token
注册成功会触发注册接口中的success回调,并有注册信息的返回如图：返回字段包含创建时间，appname，orgname等信息。
注册完成之后便可以开始调用登陆接口完成登录操作。
下面我们来了解SDK提供的两种登陆方式：
1. 用户名密码登陆（环信ID、密码登陆），截图为文档——登陆接口：
user: String //环信ID
pwd：String //注册时的密码
appKey // appkey 初始化后appkey
2. token登陆（使用token进行免密登陆）
该登陆方式可以进行免密登陆，常见用于刷新页面之后的二次登陆。
比较常用到的场景，例如从login页面跳转到chat页面，用户在当前页面刷新之后不再进行login页面登陆直接正常进行聊天。（刷新页面是会断开与环信的连接，如不登陆则无法调用SDK接口）。
token获取：token的获取是在用户名密码登陆成功后的success回调中返回获取。
access_token字段为token。
expires_in字段为token有效期，单位为秒，有效期内token可重复使用。
uni-app-demo中的用户名密码登陆的接口调用
Uni-app-demo中的token登陆：
有时我们会遇到success成功的返回了token，可是发送消息或者调用其他接口还是会出现报错，或者提示未登录的error，这时我们首要排查的情况还是检查一下onOpened监听是否成功触发，与环信的连接建立还是要以onOpened监听触发为准！
监听成功打印，意味着登陆成功！
这里顺便给大家两个检验是否登录的方法。
1. WebIM.conn方法下有一个logOut字段，该字段为true时表明未登录状态，该字段为false时表明登陆：
2. WebIM.conn.isOpened () 方法有三个状态，undefined为未登录状态，true为已登录状态，false为未登录状态，可以根据这三个状态去判断是否登录：
到这里登陆就说完了，至于为什么没有讲下去也是因为只要登录成功，其他接口就可以按需调用，相信以各位小伙伴的能力接着往下进行也不是很困难了，当然也说不定有些奇葩问题搞不定，那么建议咱们可以去环信官网去寻求我们支持同事的帮助，将遇到的问题描述清楚，问题将在24H以内得到回复。
最后愿JavaScript之父布兰登·艾克
保佑各位项目顺利上线！ 查看全部
与其说这是一篇集成攻略，其实这更多是对于官网文档的一篇解释说明，相信很多的小伙伴在准备将环信的IM即时通讯能力集成或移植在自己的项目上都会出现一头雾水或无从下手的感觉，即使看遍了官方文档也不免心生疑问：
“啥？！啥？！啥？！这是啥？！文档写的是个啥？！”
所以我决定更加直白且详细的描述一下如何集成web端的IM SDK，（小程序、Uni-app通用）以下是概览：
一、 注册环信console，创建自己的应用，拿到Appkey。
二、 粗略浏览官方文档，熟悉大致流程及接口。
三、 Clone Demo，挑出必选引入文件。
四、 Hello World! （从注册登陆开始）。
常见问题以及error报错查询入口：
http://docs-im.easemob.com/faq
http://docs-im.easemob.com/im/other/errorcode/web
http://docs-im.easemob.com/im/ ... stapi
以下为较为详细的描述一些集成步骤，如一些步骤已非常了解且已操作完成请自行跳过。
一、注册环信console，创建自己的应用，拿到Appkey
PS:这一步骤，各端通用。
1. 注册console 管理后台
相信经常使用第三方服务的小伙伴都非常熟悉这一步（不熟悉？没关系，照着葫芦画瓢就行），打开开发者平台进行注册登录创建等操作，这一点我就不过多赘述，直接上注册平台链接：https://console.easemob.com/user/login
注册成功之后会跳转到这样的一个界面：
这个就是console后台管理页面，这个实际就属于一个后台管理系统，创建自己的项目应用，监测日活，统计注册用户数，常见的一些增删改查操作都可以执行，没事可以捣鼓捣鼓看看有哪些功能，这里我就不多介绍了，咱们接着往下进行。
2. 创建应用
创建应用这一步搁咱们JavaScript其实可以理解为 new 了一个空对象，var了一个空变量等等随意怎么比喻都可以。如果放在现实当中其实更像是创建了一个公司，这个公司有公司名也就是Appname,而每个公司肯定有一个唯一的公司代码（公司的身份证ID号），也就是Appkey。公司人数也就是创建出来的应用下注册的用户数量等等。
点击添加应用开始创建：
创建应用的详情页：
这里我特意框住是因为经常有人告诉我：“创建出来的appkey在客户端测试时候点击注册没法注册，报错描述是401无权限是怎么回事？”
最后发现是创建应用的时候注册模式选的是授权注册，你选个授权注册，看眼描述就知道这种注册模式相当于注册是要经过审批的，如果测试阶段可以使用开放注册，后期还可以修改注册模式。
这个是创建成功之后点击进入应用的基本信息描述，分别对应的是什么功能也有描述，Appkey也就成功拿到了，由orgname +“#”+appname组成的appkey。如图：
这里特别说下这个Client ID和Client Secret ，有了Client ID和Client Secret就可以获取到管理员token从而可以在应用下随意增删改查，发消息，之前有遇到泄露导致客户端用户莫名其妙收到一些骚扰信息，当然这都算轻的，所以正式环境下一定要保管好Client ID和Client Secret ！！！
二、粗略浏览官方文档，熟悉大致流程及接口
PS：这一步骤，各端通用
可能有的小伙伴觉得这一步我再拉出来讲意义不是很大没什么用，其实不然，因为在协助一些小伙伴集成SDK中发现有的朋友对于在自己项目中要用到的接口都还不知道在哪，更谈不上如何使用。文档通篇一字不落看下来也不太现实，但是大致知道一些后期咱们的项目中有哪些接口可能会用到，知道大概在哪能找到调用方式还是很有必要的。
一篇文档中我们可以从这些方向看：
SDK功能分类，更新日志（了解SDK更新周期，新增功能，修复问题），Demo的使用介绍，兼容性以及常见问题。
Uni-app打包双端的介绍，运行平台描述，源码的GitHub地址。
而且文档中也有描述一些可能会遇到的坑，一些解决方案。例如：发送URL类型的图片消息需要在config配置文件中配置。
通过“WebIM.conn.mr_cache = ”方法可以重置拉取历史消息的游标。
常用的新消息提示如何去处理，等等都会有一些描述，磨刀不误砍柴工，因此我强烈建议各位在正式开始集成之前首先浏览一下咱们对应端的文档。
在此我也正好有几个常用的功能场景提供给大家，文档中有介绍，为了方便各位也还是直接上链接。
消息回执（涉及到web端已读未读的处理）：
http://docs-im.easemob.com/im/ ... %25A7
消息漫游（涉及到web端拉取历史SDK接口）：
http://docs-im.easemob.com/im/ ... %25B8
昵称与头像（涉及到昵称与头像的处理）：
http://docs-im.easemob.com/im/ ... kname
获取管理员token（一些服务端rest接口的调用需获取管理员token）：
http://docs-im.easemob.com/im/ ... %2590
拉取历史消息文件（将聊天产生的历史消息保存到本地服务器）：
http://docs-im.easemob.com/im/ ... %25B6
更多常用实现场景可以参考文档常见方案一栏，里面可能有些只有IOS 和 Android 解决方案，但是web端实际也是相似的处理方式，瞜一眼相信会有些启发。
http://docs-im.easemob.com/im/ ... troom
文档已浏览完毕，接着往下进行。
三、Clone Demo、挑选出必要文件
其实这一步主要面向于直接下载了官网Demo，但是不知道如何把将Demo往里引入的同学，在协助集成的过程中，我经常遇到有些朋友启动Demo测试完成之后，直接就把所有Demo文件拷贝到了原有项目当中，我们知道前端的部署打包的性能优化是与压缩精简代码，减少请求数量，页面结构，浏览器缓存等因素是相关的，我并不建议完全将Demo拷贝到咱们的原项目当中。
首先我想说下现有PCweb-Demo uni-appDemo 微信小程序Demo等Demo 的意义是为我们开发者小伙伴展示功能接口的实际运用，即时通讯能力的接口测验，各接口组合使用的运用逻辑及调用顺序 ，当然更是给了咱们在实际项目开发当中有了一定的参考作用。由于其功能性的考虑并没有按照线上产品的标准去做，所以其代码内部接口中有些接口的调用以及请求并未考虑性能因素，功能并未完全实现展示。
相信通过我的描述，也就明白了为什么不建议将Demo完全拷贝到原有项目中，因为可能会对咱们的性能优化造成一定的影响，并且可能会有很多代码对项目中的功能实现并无任何帮助，有些组件关联，运行可能会有更多难以排查的报错，更多是建议可以参考一下Demo当中的写法。
下面我先介绍一下uni-app-Demo集成 IMSDK的操作：
Uni-App-Demo GitHub地址：
https://github.com/easemob/webim-uniapp-demo
1. 将clone下来Demo于HbuilderX中打开，首先咱们不急着运行先了解一下目录下各个文件的作用。
<!-- 截图来自uni-appDemo中的README.md文件，详细可以自行查看 -->
2. 将核心文件导入到自己的测试项目或正式项目中。
随着环信3.x IM SDK的更新，现在引入依赖文件相对之前2.x IM SDK的集成引数个文件无疑是简单了许多。
Uni-app-Demo中需要引用的文件截图：
其实除SDK必须引入之外，WebIMConfig.js 以及WebIM.js也可以不引用，但是在项目中必须要存在，听起来很矛盾，但实际含义就是WebIMConfig.js该有的配置你必须要配置，WebIM.js中的初始化这一步你也必须要进行初始化，至于你要命名为其他文件名，放在其他位置也不是不可以的。
SDK包：PCWeb端：websdk3.x.js 小程序/Uni-app：wxsdk3.x.js
WebIMConfig.js：这个文件的作用就是将引入的WebIMSDK进行自定义配置：
如图文档上有对各个配置项的作用详细介绍，建议在集成过程中的配置页可以参考Demo中的配置进行配置，但是各个配置项的开启与否，参数设置请自行按需设置。
依然是在协助小伙伴集成环信IM的过程经常会遇到有小伙伴问配置项中的：“socket Server地址：socketServer: '//im-api-v2.easemob.com/ws', // ”和“rest Server地址：restServer: '//a1.easemob.com' ”，“需不需要配置成自己项目地址，或者自己去定义这两个参数？”，对于这个问题，我只能回答说千万别！这个是定义好了的，你要做的基本就只需要将appkey：改成自己申请的，其他几乎不用动。
WebIM.js：将SDK的配置以及引入的SDK进一步做处理简称：初始化。
导出SDK 并引入WebIMConfig.js文件,将SDK重命名为WebIM挂载到window或uni或wx下，视情况决定。
同样这一步文档也有详细的描述：
3. 完成文件导入挂载，开始配置并添加监听回调。
如图，监听仅截图一部分：
在集成Web端（包括小程序以及Uni-app）IM中，所有的事件监听都是要靠WebIM.conn.listen( )，由此可以看出其重要性。
所以在初始化阶段结束后我们首要将监听配置添加上。
至于监听的具体位置应该添加在哪里这个实际并没有严格的要求，PCwebDemo中是将监听写在了WebIM.js中，微信小程序Demo是将监听写在了app.js，uni-app是将监听写在了App.vue根组件中，多数是写在了全局。但其实监听也可以写在局部，前提局部能够访问到WebIM，然后在局部添加上监听回调，不管是全局监听还是局部监听都要在SDK接口调用之前布置好监听并开启监听。
下面我们再来聊一下监听中的个别监听回调的作用以及实际运用，其监听的作用文档已有详细描写且较为好了解，这里就不再一一赘述。
onOpened: function ( ) {}, //连接成功回调
此监听为与环信连接成功之后触发的监听回调，经常会出现一个问题就是明明环信conn.open登陆接口都已经返回success都已经返回token了，可是发送消息依然报错，接收消息也接收不到。那么我们首要检查的就是该监听有没有触发，放个console.log( )看下登陆之后的该回调有没有成功的打印，如果打印了那么说明成功与环信建立了连接！也就可以进行其他的操作了。
经常有朋友问：“登陆成功之后打印message形参为什么是undefined?是不是登陆有问题？”，其实不是这个message并不会有任何返回，登陆是否成功一切以onOpened监听回调是否执行为准！
在该监听的实际运用中Demo中其实也做了很好的演示，就是登陆之后的页面跳转，这个非常常用，因为IM聊天功能是否可以使用首要的判断必然是与环信是否建立连接成功，成功那么跳转进入聊天页面。
onClosed: function ( message ) {}, //连接关闭回调
此监听为与环信连接关闭的监听回调，其实也没有具体要描述的地方，更多的是该监听经常用来处理在与环信断开连接时候的一些UI层面的提示，或者再意外断开连接之后退回到login页面，以及有些场景下进行手动重连。
onMessage：function ( message ) {}, //监听收到消息的回调
这里的onMessage是对所有收到消息的回调的一个简称，例如：onTextMessage 监听文本消息、onPictureMessage 监听图片消息、onAudioMessage 监听音频消息，等等... 这个监听相信不用过多描述就可以清楚其功能，消息监听回调非常的核心，所有的消息都是仰仗这几个监听回调拿到的。测试的时候可以在监听回调中定义形参并控制台打印参数查看消息监听是否正常触发并接收数据。
截图为onTextMessage监听收到的单聊消息
onError: function ( message ) {}, //失败回调
此监听回调可监听SDK中大多数的error抛出，在集成开发过程中帮助更快定位问题原因，并且可在回调中根据error信息从UI层面进行提示，因此其实际运用相对也常用。
截图为Uni-appDemo利用onError监听做出的提示以及一些操作。
当然有些error出现之后大家可能不知道其具体含义下面为分析一下error异常的判断思路，
首先onError监听回调的message字段就已经给出了大致error原因：
例图中onError回调返回的对象中的message字段value的值中给出了“login failed”登陆异常，接着我们看data字段下给出的具体原因，不难看出invalid password 不打开百度翻译也能猜出密码有问题，那么我们也就可以以此判断，登陆密码错误，或者对用户做出弹窗提示。
同样的type：1,同样的message：“login failed”，error详情就又不一样了，error介绍：“user not found” 用户找不到，所以具体的判断error原因还是要以data下的error_description给出的原因去定位。
当然有些error也会出现一些其他的情况，并不返回message 参数，data也是空的，只给出了一个type类型，像这种情况其实就是在没有登陆的情况下调用了SDK接口，那么这时首先要判断的就是是否登录了环信，或者已经登陆但是又断开了与环信的连接。
截图为未登录调用了获取群组详情返回的error。
在已登录的情况下查询群组详情，error详情直接给出了找不到 group ID为XXXXXX的群组，此时就可以以此判断，或给出提示查找不到群ID为...的详情
onPresence: function ( message ) {}, //处理“广播”或“发布-订阅”消息，如联系人订阅请求、处理群组、聊天室被踢解散等消息。
此监听正如描述所讲，处理“广播”或“发布-订阅消息”，至于发布-订阅消息可以去了解一下设计模式，发布订阅者模式，这里就不再进行解释了，这里主要讲的是该监听如果在实际运用中的作用是什么。
我们先看下Uni-appDemo中的示例：
通过观察我们看到了示例中运用到了switch case 语句通过回调里message中不同的type类型从而对应执行不同的提示或其他逻辑操作。
在实际SDK集成过程中，例如：“申请添加好友、删除好友，邀请入群，他人退群，新增群组管理员、他人加入聊天室，退出聊天室”等操作均会触发此监听的执行并回调出对应行为类型的type字段，根据type类型我们从而可以给出对应的UI层面的提示，或发布-订阅事件，uni-appDemo中的disp.fire(‘XXXX’),正是发布-订阅模式中的发布事件。
如果我们需要详细的类型，则可以在文档中的事件监听找到：
好友状态事件监听：
现有的好友事件监听，已新增对应的回调监听：
群组事件监听：
文档地址：
http://docs-im.easemob.com/im/ ... %25AC
聊天室事件监听：
文档地址：
http://docs-im.easemob.com/im/ ... %25AC
以上变为常用的几个监听的介绍，具体的使用还是以咱们实际项目中的逻辑为准。
SDK，config配置，以及初始化，监听都已配置完毕，下面我们就开始注册、登陆环信ID，发出我们的第一条消息吧！
四、Hello World ! (从注册登录开始)
环信所有的功能性SDK接口调用都是要从注册及登陆成功方可有效使用，如已注册，登陆则是客户端调用的第一个接口。
下面我将从注册接口开始讲起：
注册，web端注册接口如图：
客户端是否能够直接调用注册接口，需要先去环信IM管理后台检查该Appkey的注册模式是否为开放注册，授权模式的话，此接口调用注册会直接出现下图情况
Open registration doesn't allow, so register user need token
开放注册不允许，所以注册用户需要token
注册成功会触发注册接口中的success回调,并有注册信息的返回如图：返回字段包含创建时间，appname，orgname等信息。
注册完成之后便可以开始调用登陆接口完成登录操作。
下面我们来了解SDK提供的两种登陆方式：
1. 用户名密码登陆（环信ID、密码登陆），截图为文档——登陆接口：
user: String //环信ID
pwd：String //注册时的密码
appKey // appkey 初始化后appkey
2. token登陆（使用token进行免密登陆）
该登陆方式可以进行免密登陆，常见用于刷新页面之后的二次登陆。
比较常用到的场景，例如从login页面跳转到chat页面，用户在当前页面刷新之后不再进行login页面登陆直接正常进行聊天。（刷新页面是会断开与环信的连接，如不登陆则无法调用SDK接口）。
token获取：token的获取是在用户名密码登陆成功后的success回调中返回获取。
access_token字段为token。
expires_in字段为token有效期，单位为秒，有效期内token可重复使用。
uni-app-demo中的用户名密码登陆的接口调用
Uni-app-demo中的token登陆：
有时我们会遇到success成功的返回了token，可是发送消息或者调用其他接口还是会出现报错，或者提示未登录的error，这时我们首要排查的情况还是检查一下onOpened监听是否成功触发，与环信的连接建立还是要以onOpened监听触发为准！
监听成功打印，意味着登陆成功！
这里顺便给大家两个检验是否登录的方法。
1. WebIM.conn方法下有一个logOut字段，该字段为true时表明未登录状态，该字段为false时表明登陆：
2. WebIM.conn.isOpened () 方法有三个状态，undefined为未登录状态，true为已登录状态，false为未登录状态，可以根据这三个状态去判断是否登录：
到这里登陆就说完了，至于为什么没有讲下去也是因为只要登录成功，其他接口就可以按需调用，相信以各位小伙伴的能力接着往下进行也不是很困难了，当然也说不定有些奇葩问题搞不定，那么建议咱们可以去环信官网去寻求我们支持同事的帮助，将遇到的问题描述清楚，问题将在24H以内得到回复。
最后愿JavaScript之父布兰登·艾克
保佑各位项目顺利上线！
“啥？！啥？！啥？！这是啥？！文档写的是个啥？！”
所以我决定更加直白且详细的描述一下如何集成web端的IM SDK，（小程序、Uni-app通用）以下是概览：
一、 注册环信console，创建自己的应用，拿到Appkey。
二、 粗略浏览官方文档，熟悉大致流程及接口。
三、 Clone Demo，挑出必选引入文件。
四、 Hello World! （从注册登陆开始）。
常见问题以及error报错查询入口：
http://docs-im.easemob.com/faq
http://docs-im.easemob.com/im/other/errorcode/web
http://docs-im.easemob.com/im/ ... stapi
以下为较为详细的描述一些集成步骤，如一些步骤已非常了解且已操作完成请自行跳过。
一、注册环信console，创建自己的应用，拿到Appkey
PS:这一步骤，各端通用。
1. 注册console 管理后台
相信经常使用第三方服务的小伙伴都非常熟悉这一步（不熟悉？没关系，照着葫芦画瓢就行），打开开发者平台进行注册登录创建等操作，这一点我就不过多赘述，直接上注册平台链接：https://console.easemob.com/user/login
注册成功之后会跳转到这样的一个界面：
这个就是console后台管理页面，这个实际就属于一个后台管理系统，创建自己的项目应用，监测日活，统计注册用户数，常见的一些增删改查操作都可以执行，没事可以捣鼓捣鼓看看有哪些功能，这里我就不多介绍了，咱们接着往下进行。
2. 创建应用
创建应用这一步搁咱们JavaScript其实可以理解为 new 了一个空对象，var了一个空变量等等随意怎么比喻都可以。如果放在现实当中其实更像是创建了一个公司，这个公司有公司名也就是Appname,而每个公司肯定有一个唯一的公司代码（公司的身份证ID号），也就是Appkey。公司人数也就是创建出来的应用下注册的用户数量等等。
点击添加应用开始创建：
创建应用的详情页：
这里我特意框住是因为经常有人告诉我：“创建出来的appkey在客户端测试时候点击注册没法注册，报错描述是401无权限是怎么回事？”
最后发现是创建应用的时候注册模式选的是授权注册，你选个授权注册，看眼描述就知道这种注册模式相当于注册是要经过审批的，如果测试阶段可以使用开放注册，后期还可以修改注册模式。
这个是创建成功之后点击进入应用的基本信息描述，分别对应的是什么功能也有描述，Appkey也就成功拿到了，由orgname +“#”+appname组成的appkey。如图：
这里特别说下这个Client ID和Client Secret ，有了Client ID和Client Secret就可以获取到管理员token从而可以在应用下随意增删改查，发消息，之前有遇到泄露导致客户端用户莫名其妙收到一些骚扰信息，当然这都算轻的，所以正式环境下一定要保管好Client ID和Client Secret ！！！
二、粗略浏览官方文档，熟悉大致流程及接口
PS：这一步骤，各端通用
可能有的小伙伴觉得这一步我再拉出来讲意义不是很大没什么用，其实不然，因为在协助一些小伙伴集成SDK中发现有的朋友对于在自己项目中要用到的接口都还不知道在哪，更谈不上如何使用。文档通篇一字不落看下来也不太现实，但是大致知道一些后期咱们的项目中有哪些接口可能会用到，知道大概在哪能找到调用方式还是很有必要的。
一篇文档中我们可以从这些方向看：
SDK功能分类，更新日志（了解SDK更新周期，新增功能，修复问题），Demo的使用介绍，兼容性以及常见问题。
Uni-app打包双端的介绍，运行平台描述，源码的GitHub地址。
而且文档中也有描述一些可能会遇到的坑，一些解决方案。例如：发送URL类型的图片消息需要在config配置文件中配置。
通过“WebIM.conn.mr_cache = ”方法可以重置拉取历史消息的游标。
常用的新消息提示如何去处理，等等都会有一些描述，磨刀不误砍柴工，因此我强烈建议各位在正式开始集成之前首先浏览一下咱们对应端的文档。
在此我也正好有几个常用的功能场景提供给大家，文档中有介绍，为了方便各位也还是直接上链接。
消息回执（涉及到web端已读未读的处理）：
http://docs-im.easemob.com/im/ ... %25A7
消息漫游（涉及到web端拉取历史SDK接口）：
http://docs-im.easemob.com/im/ ... %25B8
昵称与头像（涉及到昵称与头像的处理）：
http://docs-im.easemob.com/im/ ... kname
获取管理员token（一些服务端rest接口的调用需获取管理员token）：
http://docs-im.easemob.com/im/ ... %2590
拉取历史消息文件（将聊天产生的历史消息保存到本地服务器）：
http://docs-im.easemob.com/im/ ... %25B6
更多常用实现场景可以参考文档常见方案一栏，里面可能有些只有IOS 和 Android 解决方案，但是web端实际也是相似的处理方式，瞜一眼相信会有些启发。
http://docs-im.easemob.com/im/ ... troom
文档已浏览完毕，接着往下进行。
三、Clone Demo、挑选出必要文件
其实这一步主要面向于直接下载了官网Demo，但是不知道如何把将Demo往里引入的同学，在协助集成的过程中，我经常遇到有些朋友启动Demo测试完成之后，直接就把所有Demo文件拷贝到了原有项目当中，我们知道前端的部署打包的性能优化是与压缩精简代码，减少请求数量，页面结构，浏览器缓存等因素是相关的，我并不建议完全将Demo拷贝到咱们的原项目当中。
首先我想说下现有PCweb-Demo uni-appDemo 微信小程序Demo等Demo 的意义是为我们开发者小伙伴展示功能接口的实际运用，即时通讯能力的接口测验，各接口组合使用的运用逻辑及调用顺序 ，当然更是给了咱们在实际项目开发当中有了一定的参考作用。由于其功能性的考虑并没有按照线上产品的标准去做，所以其代码内部接口中有些接口的调用以及请求并未考虑性能因素，功能并未完全实现展示。
相信通过我的描述，也就明白了为什么不建议将Demo完全拷贝到原有项目中，因为可能会对咱们的性能优化造成一定的影响，并且可能会有很多代码对项目中的功能实现并无任何帮助，有些组件关联，运行可能会有更多难以排查的报错，更多是建议可以参考一下Demo当中的写法。
下面我先介绍一下uni-app-Demo集成 IMSDK的操作：
Uni-App-Demo GitHub地址：
https://github.com/easemob/webim-uniapp-demo
1. 将clone下来Demo于HbuilderX中打开，首先咱们不急着运行先了解一下目录下各个文件的作用。
<!-- 截图来自uni-appDemo中的README.md文件，详细可以自行查看 -->
2. 将核心文件导入到自己的测试项目或正式项目中。
随着环信3.x IM SDK的更新，现在引入依赖文件相对之前2.x IM SDK的集成引数个文件无疑是简单了许多。
Uni-app-Demo中需要引用的文件截图：
其实除SDK必须引入之外，WebIMConfig.js 以及WebIM.js也可以不引用，但是在项目中必须要存在，听起来很矛盾，但实际含义就是WebIMConfig.js该有的配置你必须要配置，WebIM.js中的初始化这一步你也必须要进行初始化，至于你要命名为其他文件名，放在其他位置也不是不可以的。
SDK包：PCWeb端：websdk3.x.js 小程序/Uni-app：wxsdk3.x.js
WebIMConfig.js：这个文件的作用就是将引入的WebIMSDK进行自定义配置：
如图文档上有对各个配置项的作用详细介绍，建议在集成过程中的配置页可以参考Demo中的配置进行配置，但是各个配置项的开启与否，参数设置请自行按需设置。
依然是在协助小伙伴集成环信IM的过程经常会遇到有小伙伴问配置项中的：“socket Server地址：socketServer: '//im-api-v2.easemob.com/ws', // ”和“rest Server地址：restServer: '//a1.easemob.com' ”，“需不需要配置成自己项目地址，或者自己去定义这两个参数？”，对于这个问题，我只能回答说千万别！这个是定义好了的，你要做的基本就只需要将appkey：改成自己申请的，其他几乎不用动。
WebIM.js：将SDK的配置以及引入的SDK进一步做处理简称：初始化。
导出SDK 并引入WebIMConfig.js文件,将SDK重命名为WebIM挂载到window或uni或wx下，视情况决定。
同样这一步文档也有详细的描述：
3. 完成文件导入挂载，开始配置并添加监听回调。
如图，监听仅截图一部分：
在集成Web端（包括小程序以及Uni-app）IM中，所有的事件监听都是要靠WebIM.conn.listen( )，由此可以看出其重要性。
所以在初始化阶段结束后我们首要将监听配置添加上。
至于监听的具体位置应该添加在哪里这个实际并没有严格的要求，PCwebDemo中是将监听写在了WebIM.js中，微信小程序Demo是将监听写在了app.js，uni-app是将监听写在了App.vue根组件中，多数是写在了全局。但其实监听也可以写在局部，前提局部能够访问到WebIM，然后在局部添加上监听回调，不管是全局监听还是局部监听都要在SDK接口调用之前布置好监听并开启监听。
下面我们再来聊一下监听中的个别监听回调的作用以及实际运用，其监听的作用文档已有详细描写且较为好了解，这里就不再一一赘述。
onOpened: function ( ) {}, //连接成功回调
此监听为与环信连接成功之后触发的监听回调，经常会出现一个问题就是明明环信conn.open登陆接口都已经返回success都已经返回token了，可是发送消息依然报错，接收消息也接收不到。那么我们首要检查的就是该监听有没有触发，放个console.log( )看下登陆之后的该回调有没有成功的打印，如果打印了那么说明成功与环信建立了连接！也就可以进行其他的操作了。
经常有朋友问：“登陆成功之后打印message形参为什么是undefined?是不是登陆有问题？”，其实不是这个message并不会有任何返回，登陆是否成功一切以onOpened监听回调是否执行为准！
在该监听的实际运用中Demo中其实也做了很好的演示，就是登陆之后的页面跳转，这个非常常用，因为IM聊天功能是否可以使用首要的判断必然是与环信是否建立连接成功，成功那么跳转进入聊天页面。
onClosed: function ( message ) {}, //连接关闭回调
此监听为与环信连接关闭的监听回调，其实也没有具体要描述的地方，更多的是该监听经常用来处理在与环信断开连接时候的一些UI层面的提示，或者再意外断开连接之后退回到login页面，以及有些场景下进行手动重连。
onMessage：function ( message ) {}, //监听收到消息的回调
这里的onMessage是对所有收到消息的回调的一个简称，例如：onTextMessage 监听文本消息、onPictureMessage 监听图片消息、onAudioMessage 监听音频消息，等等... 这个监听相信不用过多描述就可以清楚其功能，消息监听回调非常的核心，所有的消息都是仰仗这几个监听回调拿到的。测试的时候可以在监听回调中定义形参并控制台打印参数查看消息监听是否正常触发并接收数据。
截图为onTextMessage监听收到的单聊消息
onError: function ( message ) {}, //失败回调
此监听回调可监听SDK中大多数的error抛出，在集成开发过程中帮助更快定位问题原因，并且可在回调中根据error信息从UI层面进行提示，因此其实际运用相对也常用。
截图为Uni-appDemo利用onError监听做出的提示以及一些操作。
当然有些error出现之后大家可能不知道其具体含义下面为分析一下error异常的判断思路，
首先onError监听回调的message字段就已经给出了大致error原因：
例图中onError回调返回的对象中的message字段value的值中给出了“login failed”登陆异常，接着我们看data字段下给出的具体原因，不难看出invalid password 不打开百度翻译也能猜出密码有问题，那么我们也就可以以此判断，登陆密码错误，或者对用户做出弹窗提示。
同样的type：1,同样的message：“login failed”，error详情就又不一样了，error介绍：“user not found” 用户找不到，所以具体的判断error原因还是要以data下的error_description给出的原因去定位。
当然有些error也会出现一些其他的情况，并不返回message 参数，data也是空的，只给出了一个type类型，像这种情况其实就是在没有登陆的情况下调用了SDK接口，那么这时首先要判断的就是是否登录了环信，或者已经登陆但是又断开了与环信的连接。
截图为未登录调用了获取群组详情返回的error。
在已登录的情况下查询群组详情，error详情直接给出了找不到 group ID为XXXXXX的群组，此时就可以以此判断，或给出提示查找不到群ID为...的详情
onPresence: function ( message ) {}, //处理“广播”或“发布-订阅”消息，如联系人订阅请求、处理群组、聊天室被踢解散等消息。
此监听正如描述所讲，处理“广播”或“发布-订阅消息”，至于发布-订阅消息可以去了解一下设计模式，发布订阅者模式，这里就不再进行解释了，这里主要讲的是该监听如果在实际运用中的作用是什么。
我们先看下Uni-appDemo中的示例：
通过观察我们看到了示例中运用到了switch case 语句通过回调里message中不同的type类型从而对应执行不同的提示或其他逻辑操作。
在实际SDK集成过程中，例如：“申请添加好友、删除好友，邀请入群，他人退群，新增群组管理员、他人加入聊天室，退出聊天室”等操作均会触发此监听的执行并回调出对应行为类型的type字段，根据type类型我们从而可以给出对应的UI层面的提示，或发布-订阅事件，uni-appDemo中的disp.fire(‘XXXX’),正是发布-订阅模式中的发布事件。
如果我们需要详细的类型，则可以在文档中的事件监听找到：
好友状态事件监听：
现有的好友事件监听，已新增对应的回调监听：
群组事件监听：
文档地址：
http://docs-im.easemob.com/im/ ... %25AC
聊天室事件监听：
文档地址：
http://docs-im.easemob.com/im/ ... %25AC
以上变为常用的几个监听的介绍，具体的使用还是以咱们实际项目中的逻辑为准。
SDK，config配置，以及初始化，监听都已配置完毕，下面我们就开始注册、登陆环信ID，发出我们的第一条消息吧！
四、Hello World ! (从注册登录开始)
环信所有的功能性SDK接口调用都是要从注册及登陆成功方可有效使用，如已注册，登陆则是客户端调用的第一个接口。
下面我将从注册接口开始讲起：
注册，web端注册接口如图：
客户端是否能够直接调用注册接口，需要先去环信IM管理后台检查该Appkey的注册模式是否为开放注册，授权模式的话，此接口调用注册会直接出现下图情况
Open registration doesn't allow, so register user need token
开放注册不允许，所以注册用户需要token
注册成功会触发注册接口中的success回调,并有注册信息的返回如图：返回字段包含创建时间，appname，orgname等信息。
注册完成之后便可以开始调用登陆接口完成登录操作。
下面我们来了解SDK提供的两种登陆方式：
1. 用户名密码登陆（环信ID、密码登陆），截图为文档——登陆接口：
user: String //环信ID
pwd：String //注册时的密码
appKey // appkey 初始化后appkey
2. token登陆（使用token进行免密登陆）
该登陆方式可以进行免密登陆，常见用于刷新页面之后的二次登陆。
比较常用到的场景，例如从login页面跳转到chat页面，用户在当前页面刷新之后不再进行login页面登陆直接正常进行聊天。（刷新页面是会断开与环信的连接，如不登陆则无法调用SDK接口）。
token获取：token的获取是在用户名密码登陆成功后的success回调中返回获取。
access_token字段为token。
expires_in字段为token有效期，单位为秒，有效期内token可重复使用。
uni-app-demo中的用户名密码登陆的接口调用
Uni-app-demo中的token登陆：
有时我们会遇到success成功的返回了token，可是发送消息或者调用其他接口还是会出现报错，或者提示未登录的error，这时我们首要排查的情况还是检查一下onOpened监听是否成功触发，与环信的连接建立还是要以onOpened监听触发为准！
监听成功打印，意味着登陆成功！
这里顺便给大家两个检验是否登录的方法。
1. WebIM.conn方法下有一个logOut字段，该字段为true时表明未登录状态，该字段为false时表明登陆：
2. WebIM.conn.isOpened () 方法有三个状态，undefined为未登录状态，true为已登录状态，false为未登录状态，可以根据这三个状态去判断是否登录：
到这里登陆就说完了，至于为什么没有讲下去也是因为只要登录成功，其他接口就可以按需调用，相信以各位小伙伴的能力接着往下进行也不是很困难了，当然也说不定有些奇葩问题搞不定，那么建议咱们可以去环信官网去寻求我们支持同事的帮助，将遇到的问题描述清楚，问题将在24H以内得到回复。
最后愿JavaScript之父布兰登·艾克
保佑各位项目顺利上线！
9
评论
顶 【源码下载】一款使用环信实现的开源灵魂社交APP（含服务器）
开发讨论 • beyond 发表了文章 • 61594 次浏览 • 2019-07-01 10:48
#前言
近期，环信热心开发者-穿裤衩闯天下使用环信IM开发了一款实时聊天应用，包含简单的服务器端，现在正式开源给小伙伴们。感兴趣的同学可以一起搞一下哦，详细介绍请往下看。
上代码
服务器：VMServer
客户端：VMMatch
#VMMatch
猿匹配 —— 国内首个程序猿非严肃婚恋交友应用，让我们一言不合就来场匹配吧
#介绍#
首先说下中文名：为什么叫这个名字呢，因为这是一个程序猿(媛)之间匹配交流的应用啊其实这是一个使用环信 IM 开发的一款开源聊天项目，涵盖了时下流行的一些聊天元素，同时已将 IM 功能封装为单独库，可以直接引用，方便使用
项目还处在初期阶段，还有许多功能需要实现，有兴趣的可以一起来
项目资源均来自于互联网，如果有侵权请联系我
#下载体验
猿匹配 小米商店 审核中
猿匹配 Google Play
#项目截图
#开发环境
项目基本属于在最新的Android开发环境下开发，使用Java8的一些新特性，比如Lambda表达式，
然后项目已经适配Android6.x以上的动态权限适配，以及7.x的文件选择，和8.x的通知提醒等；
· Mac OS 10.14.4
· Android Studio 3.3.2
#项目模块儿
本项目包含两部分：
一部分是项目主模块app，这部分主要包含了项目的业务逻辑，比如匹配、信息修改、设置等
另一部分是封装成library的vmim，这是为了方便大家引用到自己的项目中做的一步封装，不用再去复杂的复制代码和资源等，
只需要将vmim以module导入到自己的项目中就行了，具体使用方式参见项目app模块儿；
#功能与 TODO
IM部分功能
· [x] 链接监听
· [x] 登录注册
· [x] 会话功能
。[x] 置顶
。[x] 标为未读
。[x] 删除与清空
。[x] 草稿功能
· [x] 消息功能
。[x] 下拉加载更多
。[x] 消息复制（仅文字类消息）
。[x] 消息删除
。[x] 文本+Emoji消息收发
。[x] 大表情消息收发
。[x] 图片消息
~[x] 查看大图
~[ ] 保存图片
。[x] 语音消息
~[x] 语音录制
~[x] 语音播放（可暂停，波形待优化）
~[x] 听筒和扬声器播放切换
。[x] 语音实时通话功能
。[x] 视频实时通话功能
。[x] 通话过程中的娱乐消息收发
~[x] 骰子
~[x] 石头剪刀布
~[x] 大表情
。[x] 昵称头像处理（通过回调实现）
App部分功能
· [x] 登录注册（包括业务逻辑和 IM 逻辑）
· [x] 匹配
。[x] 提交匹配信息
。[x] 拉取匹配信息
· [x] 聊天（这里直接加载 IM 模块儿）
· [x] 我的
。[x] 个人信息展示
。[x] 上传头像
。[x] 设置昵称
。[x] 设置签名
· [x] 设置
。[x] 个人信息设置
。[x] 通知提醒
。[x] 聊天
。[ ] 隐私（随业务部分一起完善）
。[ ] 通用（随业务部分一起完善）
。[ ] 帮助反馈（随业务部分一起完善）
。[x] 关于
。[x] 退出
· [ ] 社区
。[ ] 发布
。[ ] 评论
。[ ] 收藏
。[ ] 关注
发布功能
· [x] 多渠道打包
· [x] 签名配置
· [x] 开发与线上环境配置
· [x] 敏感信息保护
#配置运行
1.首先复制config.default.gradle到config.gradle
2.配置下config.gradle环信appkey以及bugly统计Id
3.正式打包需要配置下签名信息，同时将签名文件放置在项目根目录
#参与贡献
如果你有什么好的想法，或者好的实现，可以通过下边的步骤参与进来，让我们一起把这个项目做得更好，欢迎参与
1.Fork本仓库
2.新建feature_xxx分支 (单独创建一个实现你自己想法的分支)
3.提交代码
4.新建Pull Request
5.等待我们的Review & Merge
#关联项目
服务器端由nodejs实现，地址见这里 VMServer
#VMServer
是为Android开源项目VMMatch项目（中文名猿匹配）实现的服务端
#简介
这个项目包含两部分
· 根目录：服务逻辑及API接口实现
· client目录：前端界面，和服务器端代码端放置在同一仓库下（暂未实现）
#使用
简单介绍下运行环境及部署方法
1.安装nodejs开发时使用的是v10.16.0版本
2.需要安装mongodb并启动，开发使用版本4.0.10
3.下载项目到服务器，可以下载压缩包，或者用git clone命令
4.复制config_default.js到config.js，可根据自己需要修改配置文件
5.安装依赖npm install
6.全局安装pm2npm install pm2 -g
7.运行 vmshell.sh
扫码备注【开源项目】邀你加入环信开源社群
转载自https://blog.melove.net/develop-open-source-im-match-and-server/
查看全部
近期，环信热心开发者-穿裤衩闯天下使用环信IM开发了一款实时聊天应用，包含简单的服务器端，现在正式开源给小伙伴们。感兴趣的同学可以一起搞一下哦，详细介绍请往下看。
上代码
服务器：VMServer
客户端：VMMatch
#VMMatch
猿匹配 —— 国内首个程序猿非严肃婚恋交友应用，让我们一言不合就来场匹配吧
#介绍#
首先说下中文名：为什么叫这个名字呢，因为这是一个程序猿(媛)之间匹配交流的应用啊其实这是一个使用环信 IM 开发的一款开源聊天项目，涵盖了时下流行的一些聊天元素，同时已将 IM 功能封装为单独库，可以直接引用，方便使用
项目还处在初期阶段，还有许多功能需要实现，有兴趣的可以一起来
项目资源均来自于互联网，如果有侵权请联系我
#下载体验
猿匹配 小米商店 审核中
猿匹配 Google Play
#项目截图
#开发环境
项目基本属于在最新的Android开发环境下开发，使用Java8的一些新特性，比如Lambda表达式，
然后项目已经适配Android6.x以上的动态权限适配，以及7.x的文件选择，和8.x的通知提醒等；
· Mac OS 10.14.4
· Android Studio 3.3.2
#项目模块儿
本项目包含两部分：
一部分是项目主模块app，这部分主要包含了项目的业务逻辑，比如匹配、信息修改、设置等
另一部分是封装成library的vmim，这是为了方便大家引用到自己的项目中做的一步封装，不用再去复杂的复制代码和资源等，
只需要将vmim以module导入到自己的项目中就行了，具体使用方式参见项目app模块儿；
#功能与 TODO
IM部分功能
· [x] 链接监听
· [x] 登录注册
· [x] 会话功能
。[x] 置顶
。[x] 标为未读
。[x] 删除与清空
。[x] 草稿功能
· [x] 消息功能
。[x] 下拉加载更多
。[x] 消息复制（仅文字类消息）
。[x] 消息删除
。[x] 文本+Emoji消息收发
。[x] 大表情消息收发
。[x] 图片消息
~[x] 查看大图
~[ ] 保存图片
。[x] 语音消息
~[x] 语音录制
~[x] 语音播放（可暂停，波形待优化）
~[x] 听筒和扬声器播放切换
。[x] 语音实时通话功能
。[x] 视频实时通话功能
。[x] 通话过程中的娱乐消息收发
~[x] 骰子
~[x] 石头剪刀布
~[x] 大表情
。[x] 昵称头像处理（通过回调实现）
App部分功能
· [x] 登录注册（包括业务逻辑和 IM 逻辑）
· [x] 匹配
。[x] 提交匹配信息
。[x] 拉取匹配信息
· [x] 聊天（这里直接加载 IM 模块儿）
· [x] 我的
。[x] 个人信息展示
。[x] 上传头像
。[x] 设置昵称
。[x] 设置签名
· [x] 设置
。[x] 个人信息设置
。[x] 通知提醒
。[x] 聊天
。[ ] 隐私（随业务部分一起完善）
。[ ] 通用（随业务部分一起完善）
。[ ] 帮助反馈（随业务部分一起完善）
。[x] 关于
。[x] 退出
· [ ] 社区
。[ ] 发布
。[ ] 评论
。[ ] 收藏
。[ ] 关注
发布功能
· [x] 多渠道打包
· [x] 签名配置
· [x] 开发与线上环境配置
· [x] 敏感信息保护
#配置运行
1.首先复制config.default.gradle到config.gradle
2.配置下config.gradle环信appkey以及bugly统计Id
3.正式打包需要配置下签名信息，同时将签名文件放置在项目根目录
#参与贡献
如果你有什么好的想法，或者好的实现，可以通过下边的步骤参与进来，让我们一起把这个项目做得更好，欢迎参与
1.Fork本仓库
2.新建feature_xxx分支 (单独创建一个实现你自己想法的分支)
3.提交代码
4.新建Pull Request
5.等待我们的Review & Merge
#关联项目
服务器端由nodejs实现，地址见这里 VMServer
#VMServer
是为Android开源项目VMMatch项目（中文名猿匹配）实现的服务端
#简介
这个项目包含两部分
· 根目录：服务逻辑及API接口实现
· client目录：前端界面，和服务器端代码端放置在同一仓库下（暂未实现）
#使用
简单介绍下运行环境及部署方法
1.安装nodejs开发时使用的是v10.16.0版本
2.需要安装mongodb并启动，开发使用版本4.0.10
3.下载项目到服务器，可以下载压缩包，或者用git clone命令
4.复制config_default.js到config.js，可根据自己需要修改配置文件
5.安装依赖npm install
6.全局安装pm2npm install pm2 -g
7.运行 vmshell.sh
扫码备注【开源项目】邀你加入环信开源社群
转载自https://blog.melove.net/develop-open-source-im-match-and-server/
查看全部
#前言
近期，环信热心开发者-穿裤衩闯天下使用环信IM开发了一款实时聊天应用，包含简单的服务器端，现在正式开源给小伙伴们。感兴趣的同学可以一起搞一下哦，详细介绍请往下看。
上代码
服务器：VMServer
客户端：VMMatch
#VMMatch
猿匹配 —— 国内首个程序猿非严肃婚恋交友应用，让我们一言不合就来场匹配吧
#介绍#
首先说下中文名：为什么叫这个名字呢，因为这是一个程序猿(媛)之间匹配交流的应用啊其实这是一个使用环信 IM 开发的一款开源聊天项目，涵盖了时下流行的一些聊天元素，同时已将 IM 功能封装为单独库，可以直接引用，方便使用
项目还处在初期阶段，还有许多功能需要实现，有兴趣的可以一起来
项目资源均来自于互联网，如果有侵权请联系我
#下载体验
猿匹配 小米商店 审核中
猿匹配 Google Play
#项目截图
#开发环境
项目基本属于在最新的Android开发环境下开发，使用Java8的一些新特性，比如Lambda表达式，
然后项目已经适配Android6.x以上的动态权限适配，以及7.x的文件选择，和8.x的通知提醒等；
· Mac OS 10.14.4
· Android Studio 3.3.2
#项目模块儿
本项目包含两部分：
一部分是项目主模块app，这部分主要包含了项目的业务逻辑，比如匹配、信息修改、设置等
另一部分是封装成library的vmim，这是为了方便大家引用到自己的项目中做的一步封装，不用再去复杂的复制代码和资源等，
只需要将vmim以module导入到自己的项目中就行了，具体使用方式参见项目app模块儿；
#功能与 TODO
IM部分功能
· [x] 链接监听
· [x] 登录注册
· [x] 会话功能
。[x] 置顶
。[x] 标为未读
。[x] 删除与清空
。[x] 草稿功能
· [x] 消息功能
。[x] 下拉加载更多
。[x] 消息复制（仅文字类消息）
。[x] 消息删除
。[x] 文本+Emoji消息收发
。[x] 大表情消息收发
。[x] 图片消息
~[x] 查看大图
~[ ] 保存图片
。[x] 语音消息
~[x] 语音录制
~[x] 语音播放（可暂停，波形待优化）
~[x] 听筒和扬声器播放切换
。[x] 语音实时通话功能
。[x] 视频实时通话功能
。[x] 通话过程中的娱乐消息收发
~[x] 骰子
~[x] 石头剪刀布
~[x] 大表情
。[x] 昵称头像处理（通过回调实现）
App部分功能
· [x] 登录注册（包括业务逻辑和 IM 逻辑）
· [x] 匹配
。[x] 提交匹配信息
。[x] 拉取匹配信息
· [x] 聊天（这里直接加载 IM 模块儿）
· [x] 我的
。[x] 个人信息展示
。[x] 上传头像
。[x] 设置昵称
。[x] 设置签名
· [x] 设置
。[x] 个人信息设置
。[x] 通知提醒
。[x] 聊天
。[ ] 隐私（随业务部分一起完善）
。[ ] 通用（随业务部分一起完善）
。[ ] 帮助反馈（随业务部分一起完善）
。[x] 关于
。[x] 退出
· [ ] 社区
。[ ] 发布
。[ ] 评论
。[ ] 收藏
。[ ] 关注
发布功能
· [x] 多渠道打包
· [x] 签名配置
· [x] 开发与线上环境配置
· [x] 敏感信息保护
#配置运行
1.首先复制config.default.gradle到config.gradle
2.配置下config.gradle环信appkey以及bugly统计Id
3.正式打包需要配置下签名信息，同时将签名文件放置在项目根目录
#参与贡献
如果你有什么好的想法，或者好的实现，可以通过下边的步骤参与进来，让我们一起把这个项目做得更好，欢迎参与
1.Fork本仓库
2.新建feature_xxx分支 (单独创建一个实现你自己想法的分支)
3.提交代码
4.新建Pull Request
5.等待我们的Review & Merge
#关联项目
服务器端由nodejs实现，地址见这里 VMServer
#VMServer
是为Android开源项目VMMatch项目（中文名猿匹配）实现的服务端
#简介
这个项目包含两部分
· 根目录：服务逻辑及API接口实现
· client目录：前端界面，和服务器端代码端放置在同一仓库下（暂未实现）
#使用
简单介绍下运行环境及部署方法
1.安装nodejs开发时使用的是v10.16.0版本
2.需要安装mongodb并启动，开发使用版本4.0.10
3.下载项目到服务器，可以下载压缩包，或者用git clone命令
4.复制config_default.js到config.js，可根据自己需要修改配置文件
5.安装依赖
6.全局安装pm2
7.运行 vmshell.sh
扫码备注【开源项目】邀你加入环信开源社群
转载自https://blog.melove.net/develop-open-source-im-match-and-server/
近期，环信热心开发者-穿裤衩闯天下使用环信IM开发了一款实时聊天应用，包含简单的服务器端，现在正式开源给小伙伴们。感兴趣的同学可以一起搞一下哦，详细介绍请往下看。
上代码
服务器：VMServer
客户端：VMMatch
#VMMatch
猿匹配 —— 国内首个程序猿非严肃婚恋交友应用，让我们一言不合就来场匹配吧
#介绍#
首先说下中文名：为什么叫这个名字呢，因为这是一个程序猿(媛)之间匹配交流的应用啊其实这是一个使用环信 IM 开发的一款开源聊天项目，涵盖了时下流行的一些聊天元素，同时已将 IM 功能封装为单独库，可以直接引用，方便使用
项目还处在初期阶段，还有许多功能需要实现，有兴趣的可以一起来
项目资源均来自于互联网，如果有侵权请联系我
#下载体验
猿匹配 小米商店 审核中
猿匹配 Google Play
#项目截图
#开发环境
项目基本属于在最新的Android开发环境下开发，使用Java8的一些新特性，比如Lambda表达式，
然后项目已经适配Android6.x以上的动态权限适配，以及7.x的文件选择，和8.x的通知提醒等；
· Mac OS 10.14.4
· Android Studio 3.3.2
#项目模块儿
本项目包含两部分：
一部分是项目主模块app，这部分主要包含了项目的业务逻辑，比如匹配、信息修改、设置等
另一部分是封装成library的vmim，这是为了方便大家引用到自己的项目中做的一步封装，不用再去复杂的复制代码和资源等，
只需要将vmim以module导入到自己的项目中就行了，具体使用方式参见项目app模块儿；
#功能与 TODO
IM部分功能
· [x] 链接监听
· [x] 登录注册
· [x] 会话功能
。[x] 置顶
。[x] 标为未读
。[x] 删除与清空
。[x] 草稿功能
· [x] 消息功能
。[x] 下拉加载更多
。[x] 消息复制（仅文字类消息）
。[x] 消息删除
。[x] 文本+Emoji消息收发
。[x] 大表情消息收发
。[x] 图片消息
~[x] 查看大图
~[ ] 保存图片
。[x] 语音消息
~[x] 语音录制
~[x] 语音播放（可暂停，波形待优化）
~[x] 听筒和扬声器播放切换
。[x] 语音实时通话功能
。[x] 视频实时通话功能
。[x] 通话过程中的娱乐消息收发
~[x] 骰子
~[x] 石头剪刀布
~[x] 大表情
。[x] 昵称头像处理（通过回调实现）
App部分功能
· [x] 登录注册（包括业务逻辑和 IM 逻辑）
· [x] 匹配
。[x] 提交匹配信息
。[x] 拉取匹配信息
· [x] 聊天（这里直接加载 IM 模块儿）
· [x] 我的
。[x] 个人信息展示
。[x] 上传头像
。[x] 设置昵称
。[x] 设置签名
· [x] 设置
。[x] 个人信息设置
。[x] 通知提醒
。[x] 聊天
。[ ] 隐私（随业务部分一起完善）
。[ ] 通用（随业务部分一起完善）
。[ ] 帮助反馈（随业务部分一起完善）
。[x] 关于
。[x] 退出
· [ ] 社区
。[ ] 发布
。[ ] 评论
。[ ] 收藏
。[ ] 关注
发布功能
· [x] 多渠道打包
· [x] 签名配置
· [x] 开发与线上环境配置
· [x] 敏感信息保护
#配置运行
1.首先复制config.default.gradle到config.gradle
2.配置下config.gradle环信appkey以及bugly统计Id
3.正式打包需要配置下签名信息，同时将签名文件放置在项目根目录
#参与贡献
如果你有什么好的想法，或者好的实现，可以通过下边的步骤参与进来，让我们一起把这个项目做得更好，欢迎参与
1.Fork本仓库
2.新建feature_xxx分支 (单独创建一个实现你自己想法的分支)
3.提交代码
4.新建Pull Request
5.等待我们的Review & Merge
#关联项目
服务器端由nodejs实现，地址见这里 VMServer
#VMServer
是为Android开源项目VMMatch项目（中文名猿匹配）实现的服务端
#简介
这个项目包含两部分
· 根目录：服务逻辑及API接口实现
· client目录：前端界面，和服务器端代码端放置在同一仓库下（暂未实现）
#使用
简单介绍下运行环境及部署方法
1.安装nodejs开发时使用的是v10.16.0版本
2.需要安装mongodb并启动，开发使用版本4.0.10
3.下载项目到服务器，可以下载压缩包，或者用git clone命令
4.复制config_default.js到config.js，可根据自己需要修改配置文件
5.安装依赖
npm install
6.全局安装pm2
npm install pm2 -g
7.运行 vmshell.sh
扫码备注【开源项目】邀你加入环信开源社群
转载自https://blog.melove.net/develop-open-source-im-match-and-server/
1
回复
Android android.os.DeadSystemException
Android 讨论区 • 转角45°、嫣然一笑 回复了问题 • 2 人关注 • 95 次浏览 • 2021-02-23 19:12
3
回复
环信发送消息的长度限制
WebIM 讨论区 • firstrose 回复了问题 • 3 人关注 • 117 次浏览 • 2021-02-22 10:39
1
回复
android项目接入环信IM通讯模块，用户二次登陆时输入错误密码也能登陆的问题
回复Android 讨论区 • pctools 回复了问题 • 1 人关注 • 117 次浏览 • 2021-02-20 11:36
1
回复
环信创建视频会议失败
环信技术交流 • carlwang 回复了问题 • 2 人关注 • 371 次浏览 • 2021-01-28 19:16
1
回复
iOS 自定义视频inputVideoSampleBuffer这个方法到底该怎么使用呢
iOS 讨论区 • kijieoeew 回复了问题 • 2 人关注 • 724 次浏览 • 2021-01-27 14:51
2
回复
ios最新版V3.7.2 2020-10-30 聊天界面如何识别文本为链接
iOS 讨论区 • kijieoeew 回复了问题 • 2 人关注 • 602 次浏览 • 2021-01-27 14:48
1
回复
ios最新版V3.7.2 2020-10-30 如何识别聊天内容为链接
iOS 讨论区 • kijieoeew 回复了问题 • 2 人关注 • 547 次浏览 • 2021-01-27 14:45
1
回复
1
评论
【华为云生态直播】浅谈APP增长秘籍，看直播抽取华为手环、蓝牙音箱
开发讨论 • beyond 发表了文章 • 340 次浏览 • 2021-01-21 16:47
5G时代，企业如何提升用户体验、实现增长?众所周知IM是APP拉新促活的标配服务，环信作为全球最大的即时通讯云服务商如何做到亿级高并发助力全民直播获客?小程序IM如何赋能APP客户?如何在全球200多个国家和地区服务社交、游戏等出海企业?以及面对互联网新规，如何提供敏感词过滤、智能反垃圾、鉴黄、图片合规等服务，让APP远离不良信息侵扰。
同样，作为领先的全渠道智能在线客服，环信如何为企业降低60%客服成本，提高80%线索转化?看直播，抽取华为手环、蓝牙音箱、体脂秤、双肩包等惊喜礼物，1月28日晚7点，华为云云市场新生态直播邀您不见不散!
查看全部
同样，作为领先的全渠道智能在线客服，环信如何为企业降低60%客服成本，提高80%线索转化?看直播，抽取华为手环、蓝牙音箱、体脂秤、双肩包等惊喜礼物，1月28日晚7点，华为云云市场新生态直播邀您不见不散!
查看全部
5G时代，企业如何提升用户体验、实现增长?众所周知IM是APP拉新促活的标配服务，环信作为全球最大的即时通讯云服务商如何做到亿级高并发助力全民直播获客?小程序IM如何赋能APP客户?如何在全球200多个国家和地区服务社交、游戏等出海企业?以及面对互联网新规，如何提供敏感词过滤、智能反垃圾、鉴黄、图片合规等服务，让APP远离不良信息侵扰。
同样，作为领先的全渠道智能在线客服，环信如何为企业降低60%客服成本，提高80%线索转化?看直播，抽取华为手环、蓝牙音箱、体脂秤、双肩包等惊喜礼物，1月28日晚7点，华为云云市场新生态直播邀您不见不散!
同样，作为领先的全渠道智能在线客服，环信如何为企业降低60%客服成本，提高80%线索转化?看直播，抽取华为手环、蓝牙音箱、体脂秤、双肩包等惊喜礼物，1月28日晚7点，华为云云市场新生态直播邀您不见不散!
1
评论
程序员如何写出高质量的代码程序
开发讨论 • beyond 发表了文章 • 444 次浏览 • 2021-01-11 10:36
编码是程序员最重要的工作，每个程序员都希望自己可以写出优雅，高性能，高质量的代码，对于大师级别的程序员，他们的写的代码就和艺术品一样，你会忍不住发出惊叹，他们怎么可以创造出如此惊艳的作品出来。
下面笔者就以自己的浅薄学识和一些经验来总结下优秀的程序应该具有的特点。
每个变量的命名都深思熟虑
普通程序员的变量命名很随便，以至于随便到abcd都会出来，而高质量的代码的命名则很规范，既不长，也不短，既可以读出它们的含义，又不至于显得啰嗦，总之，从变量命名你就能读出一个程序是否优雅。
从配置文件中读取变量
很多人喜欢在程序中通过注释来修改变量值，这样的做法非常不对，首先不说无用地注释影响了代码的整洁，就通过修改代码来修改变量的值就是不优雅的。
一个优秀的程序，一定是从配置文件中读取所需要的变量的，而修改配置文件对于一个人来说远远比去源代码中修改变量值要方便的多得多。
当你学会从配置文件中读取配置，修改配置的时候，你的程序才是优秀的。
一定要有测试代码
一个高质量的程序一定会有测试代码，记住无论程序功能多么简单，我们都要写测试代码。为什么TDD会流行，因为很多人懒得写代码，而TDD就是强迫你写测试代码，因为这样可以让代码更加健壮，同时，其它人修改代码也可以不会造成更重大影响。
我们不一定使用TDD进行程序开发，但是一定要写测试代码，有了测试代码，你的程序才经得起折腾，记住，有时候你会犯迷糊，但是测试代码不会，跑通过测试用例的代码至少可以让你减少很多错误。
一定要写日志
一个程序开发之后，你是没有办法预测它的使用环境和使用方式的，你能做的就是在它出现错误的时候记录下日志，这样你才可能进行分析。同时，在程序开发的过程中，通过记录日志也可以方便我们进行代码的调试，日志也是调试分析的一种方式。
永远不要重复写代码
古人云事不过三，写代码也一样，当你在很多地方写了重复代码的时候，你要记得将它们重构，永远不要写重复的代码，发现重复的时候，记得使用函数将它抽象出来。
很多人喜欢拷贝代码，然后你会发现他的程序中好多代码是一样的，而当他要修改代码的时候，不得不每一处都需要修改，这不仅浪费时间，还可能造成代码的遗漏。
代码格式要统一
记得以前听过一个笑话，我们中国人写的代码，一个人写的像一千个人写的一样，而印度人写的代码，一千人像一个人写的一样。
我们不要求所有人写的代码风格都一模一样，但是我们需要你写的代码前后要统一，同时要遵循代码推荐分隔。
现在所有的语言都有自己的代码格式风格，你只要按照规则来写就好。
总结
优秀的代码每一个变量的命名都是反复斟酌的，每一个函数都是力求最精简的，每一个方法都是尽力是最高效的。
自己写完的代码一定要复审，有时候很多明显的错误一定要避免。
代码之道永无止境，我们只有不断地总结，才能写出接近优秀的程序，而优秀的程序永远都不会存在。 查看全部
下面笔者就以自己的浅薄学识和一些经验来总结下优秀的程序应该具有的特点。
每个变量的命名都深思熟虑
普通程序员的变量命名很随便，以至于随便到abcd都会出来，而高质量的代码的命名则很规范，既不长，也不短，既可以读出它们的含义，又不至于显得啰嗦，总之，从变量命名你就能读出一个程序是否优雅。
从配置文件中读取变量
很多人喜欢在程序中通过注释来修改变量值，这样的做法非常不对，首先不说无用地注释影响了代码的整洁，就通过修改代码来修改变量的值就是不优雅的。
一个优秀的程序，一定是从配置文件中读取所需要的变量的，而修改配置文件对于一个人来说远远比去源代码中修改变量值要方便的多得多。
当你学会从配置文件中读取配置，修改配置的时候，你的程序才是优秀的。
一定要有测试代码
一个高质量的程序一定会有测试代码，记住无论程序功能多么简单，我们都要写测试代码。为什么TDD会流行，因为很多人懒得写代码，而TDD就是强迫你写测试代码，因为这样可以让代码更加健壮，同时，其它人修改代码也可以不会造成更重大影响。
我们不一定使用TDD进行程序开发，但是一定要写测试代码，有了测试代码，你的程序才经得起折腾，记住，有时候你会犯迷糊，但是测试代码不会，跑通过测试用例的代码至少可以让你减少很多错误。
一定要写日志
一个程序开发之后，你是没有办法预测它的使用环境和使用方式的，你能做的就是在它出现错误的时候记录下日志，这样你才可能进行分析。同时，在程序开发的过程中，通过记录日志也可以方便我们进行代码的调试，日志也是调试分析的一种方式。
永远不要重复写代码
古人云事不过三，写代码也一样，当你在很多地方写了重复代码的时候，你要记得将它们重构，永远不要写重复的代码，发现重复的时候，记得使用函数将它抽象出来。
很多人喜欢拷贝代码，然后你会发现他的程序中好多代码是一样的，而当他要修改代码的时候，不得不每一处都需要修改，这不仅浪费时间，还可能造成代码的遗漏。
代码格式要统一
记得以前听过一个笑话，我们中国人写的代码，一个人写的像一千个人写的一样，而印度人写的代码，一千人像一个人写的一样。
我们不要求所有人写的代码风格都一模一样，但是我们需要你写的代码前后要统一，同时要遵循代码推荐分隔。
现在所有的语言都有自己的代码格式风格，你只要按照规则来写就好。
总结
优秀的代码每一个变量的命名都是反复斟酌的，每一个函数都是力求最精简的，每一个方法都是尽力是最高效的。
自己写完的代码一定要复审，有时候很多明显的错误一定要避免。
代码之道永无止境，我们只有不断地总结，才能写出接近优秀的程序，而优秀的程序永远都不会存在。 查看全部
编码是程序员最重要的工作，每个程序员都希望自己可以写出优雅，高性能，高质量的代码，对于大师级别的程序员，他们的写的代码就和艺术品一样，你会忍不住发出惊叹，他们怎么可以创造出如此惊艳的作品出来。
下面笔者就以自己的浅薄学识和一些经验来总结下优秀的程序应该具有的特点。
每个变量的命名都深思熟虑
普通程序员的变量命名很随便，以至于随便到abcd都会出来，而高质量的代码的命名则很规范，既不长，也不短，既可以读出它们的含义，又不至于显得啰嗦，总之，从变量命名你就能读出一个程序是否优雅。
从配置文件中读取变量
很多人喜欢在程序中通过注释来修改变量值，这样的做法非常不对，首先不说无用地注释影响了代码的整洁，就通过修改代码来修改变量的值就是不优雅的。
一个优秀的程序，一定是从配置文件中读取所需要的变量的，而修改配置文件对于一个人来说远远比去源代码中修改变量值要方便的多得多。
当你学会从配置文件中读取配置，修改配置的时候，你的程序才是优秀的。
一定要有测试代码
一个高质量的程序一定会有测试代码，记住无论程序功能多么简单，我们都要写测试代码。为什么TDD会流行，因为很多人懒得写代码，而TDD就是强迫你写测试代码，因为这样可以让代码更加健壮，同时，其它人修改代码也可以不会造成更重大影响。
我们不一定使用TDD进行程序开发，但是一定要写测试代码，有了测试代码，你的程序才经得起折腾，记住，有时候你会犯迷糊，但是测试代码不会，跑通过测试用例的代码至少可以让你减少很多错误。
一定要写日志
一个程序开发之后，你是没有办法预测它的使用环境和使用方式的，你能做的就是在它出现错误的时候记录下日志，这样你才可能进行分析。同时，在程序开发的过程中，通过记录日志也可以方便我们进行代码的调试，日志也是调试分析的一种方式。
永远不要重复写代码
古人云事不过三，写代码也一样，当你在很多地方写了重复代码的时候，你要记得将它们重构，永远不要写重复的代码，发现重复的时候，记得使用函数将它抽象出来。
很多人喜欢拷贝代码，然后你会发现他的程序中好多代码是一样的，而当他要修改代码的时候，不得不每一处都需要修改，这不仅浪费时间，还可能造成代码的遗漏。
代码格式要统一
记得以前听过一个笑话，我们中国人写的代码，一个人写的像一千个人写的一样，而印度人写的代码，一千人像一个人写的一样。
我们不要求所有人写的代码风格都一模一样，但是我们需要你写的代码前后要统一，同时要遵循代码推荐分隔。
现在所有的语言都有自己的代码格式风格，你只要按照规则来写就好。
总结
优秀的代码每一个变量的命名都是反复斟酌的，每一个函数都是力求最精简的，每一个方法都是尽力是最高效的。
自己写完的代码一定要复审，有时候很多明显的错误一定要避免。
代码之道永无止境，我们只有不断地总结，才能写出接近优秀的程序，而优秀的程序永远都不会存在。
下面笔者就以自己的浅薄学识和一些经验来总结下优秀的程序应该具有的特点。
每个变量的命名都深思熟虑
普通程序员的变量命名很随便，以至于随便到abcd都会出来，而高质量的代码的命名则很规范，既不长，也不短，既可以读出它们的含义，又不至于显得啰嗦，总之，从变量命名你就能读出一个程序是否优雅。
从配置文件中读取变量
很多人喜欢在程序中通过注释来修改变量值，这样的做法非常不对，首先不说无用地注释影响了代码的整洁，就通过修改代码来修改变量的值就是不优雅的。
一个优秀的程序，一定是从配置文件中读取所需要的变量的，而修改配置文件对于一个人来说远远比去源代码中修改变量值要方便的多得多。
当你学会从配置文件中读取配置，修改配置的时候，你的程序才是优秀的。
一定要有测试代码
一个高质量的程序一定会有测试代码，记住无论程序功能多么简单，我们都要写测试代码。为什么TDD会流行，因为很多人懒得写代码，而TDD就是强迫你写测试代码，因为这样可以让代码更加健壮，同时，其它人修改代码也可以不会造成更重大影响。
我们不一定使用TDD进行程序开发，但是一定要写测试代码，有了测试代码，你的程序才经得起折腾，记住，有时候你会犯迷糊，但是测试代码不会，跑通过测试用例的代码至少可以让你减少很多错误。
一定要写日志
一个程序开发之后，你是没有办法预测它的使用环境和使用方式的，你能做的就是在它出现错误的时候记录下日志，这样你才可能进行分析。同时，在程序开发的过程中，通过记录日志也可以方便我们进行代码的调试，日志也是调试分析的一种方式。
永远不要重复写代码
古人云事不过三，写代码也一样，当你在很多地方写了重复代码的时候，你要记得将它们重构，永远不要写重复的代码，发现重复的时候，记得使用函数将它抽象出来。
很多人喜欢拷贝代码，然后你会发现他的程序中好多代码是一样的，而当他要修改代码的时候，不得不每一处都需要修改，这不仅浪费时间，还可能造成代码的遗漏。
代码格式要统一
记得以前听过一个笑话，我们中国人写的代码，一个人写的像一千个人写的一样，而印度人写的代码，一千人像一个人写的一样。
我们不要求所有人写的代码风格都一模一样，但是我们需要你写的代码前后要统一，同时要遵循代码推荐分隔。
现在所有的语言都有自己的代码格式风格，你只要按照规则来写就好。
总结
优秀的代码每一个变量的命名都是反复斟酌的，每一个函数都是力求最精简的，每一个方法都是尽力是最高效的。
自己写完的代码一定要复审，有时候很多明显的错误一定要避免。
代码之道永无止境，我们只有不断地总结，才能写出接近优秀的程序，而优秀的程序永远都不会存在。
1
回复
uni-app开发的小程序能否实现TC连麦语音聊天室并且与客户端互联互通？
环信技术交流 • HuangLeo 回复了问题 • 2 人关注 • 588 次浏览 • 2021-01-08 19:21
2
回复
android 多人视频会议,手机横屏.视频显示的为竖屏的状态
Android 讨论区 • 未命名 回复了问题 • 2 人关注 • 511 次浏览 • 2021-01-08 19:17
1
回复
环信服务器端使用token发送消息 安卓移动端怎么接收这些参数
Android 讨论区 • carlwang 回复了问题 • 2 人关注 • 704 次浏览 • 2021-01-06 19:11
1
回复
安卓，怎么设置超时时间自动挂断电话
Android 讨论区 • carlwang 回复了问题 • 2 人关注 • 658 次浏览 • 2021-01-06 19:06
1
回复
1
回复
环信vue版运行后在低版本浏览器报ontrack错误
WebIM 讨论区 • HuangLeo 回复了问题 • 2 人关注 • 780 次浏览 • 2020-12-25 18:51
1
回复
环信vue版在uc浏览器运行后报ontrack错误
WebIM 讨论区 • HuangLeo 回复了问题 • 2 人关注 • 817 次浏览 • 2020-12-25 18:50
