IM即时通讯结合mui 环信

环信文档地址：http://docs.easemob.com/im/400webimintegration/25intiate
具体的用法看下面代码，这是一个简单的用户注册：

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link rel="stylesheet" type="text/css" href="css/mui.css"/>
<style>.mui-input-group:first-child {margin-top: 20px;}
</style>
</head>
<body>
<header class="mui-bar mui-bar-nav"><a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a><h1 class="mui-title">注册</h1>
</header>
<div class="mui-content"><form class="mui-input-group"><div class="mui-input-row"><label>手机</label><input id="username" type="text" class="mui-input-clear" placeholder="请输入手机号"></div><div class="mui-input-row"><label>昵称</label><input id="nickname" type="text" class="mui-input-clear" placeholder="请输入昵称"></div><div class="mui-input-row"><label>密码</label><input id="password" type="password" class="mui-input-password" placeholder="请输入密码"></div><div class="mui-input-row"><label>确认密码</label><input id="password_confirm" type="password" class="mui-input-password" placeholder="请确认密码"></div></form><div class="mui-content-padded"><button id="reg" class="mui-btn mui-btn-block mui-btn-primary">注册</button></div>
</div>
<script src="js/mui.js" type="text/javascript" charset="utf-8"></script>
<!-- 环信web im , 以下三个文件的顺序不能变 -->
<script type="text/javascript" src="sdk/webim.config.js" ></script>
<script type="text/javascript" src="sdk/strophe-1.2.8.min.js" ></script>
<script type="text/javascript" src="sdk/websdk-1.4.5.min.js" ></script>
<script type="text/javascript">mui.init();mui("#reg")[0].addEventListener('tap',function(e){var username = mui('#username')[0].value;var nickname = mui('#nickname')[0].value;var password = mui('#password')[0].value;var passwordConfirm = mui('#password_confirm')[0].value;// 是否为电话号码function isMobile(value) {var validateReg = /0?(13|14|15|18)[0-9]{9}/;return validateReg.test(value);}// 是否为空function isEmpty(value){var validateReg = /^\S+$/;return validateReg.test(value);}if(!isMobile(username)){mui.toast('电话号码格式不正确');return;}if(!isEmpty(nickname)){mui.toast('昵称不能为空');return;}if(!isEmpty(password)){mui.toast('密码不能为空');return;}if(password != passwordConfirm){mui.toast('密码两次输入不一致');return;}//环信SDK注册var options = {username: username,password: password,nickname: nickname,appKey: WebIM.config.appkey,success: function(result){console.log(JSON.stringify(result));mui.toast('注册成功');},error:function(e){console.log(JSON.stringify(e));mui.toast('注册失败');},apiUrl: WebIM.config.apiURL};var conn = new WebIM.connection();conn.signup(options);});
</script>
</body>
</html>

这里最重要的是这几个js文件，记住顺序不要搞错了，还有版本问题，因为一直在更新，所以在版本选择上要一致，这是目前最新的版本。最后就是那个注册的函数了，之前呢使用的是registerUser()，现在不行，经试验，用signup()函数好用。

IM即时通讯结合mui 环信相关推荐

IM 即时通讯实战：环信Web IM极速集成
前置技能 Node.js 环境已搭建. npm 包管理工具的基本使用. Vue2 或者 Vue3 框架基本掌握或使用. 学习目标项目中集成 IM 即时通讯实战利用环信 IM Web SDK 快速实 ...
即时通讯，对比环信、融云、腾讯IM
即时通讯,对比环信.融云.腾讯IM 项目中用到了及时通讯,根据实际项目中用到的内容,这里仅作简单比对 – 项目环信融云腾讯云用户数量收费无上线,免费100人收费无上限,免费100人无上 ...
环信即时通讯SDK集成——环信 uni-app-demo 升级改造计划——整体代码重构优化（二）
概述本次关于 uni-app 代码整体重构工作,基于上一期针对 uni-app 官网 demo 从 vue2 迁移 vue3 框架衍生而来,在迁移过程中有明显感知,目前的项目存在的问题为,项目部分代 ...
即时通讯环信IM的集成使用
点击进入我的个人博客第三方即时通讯服务,环信 IM云的集成使用,我这里主要以 web集成为主,如何把单聊模块集成到自己的项目进行的操作讲解,更多详细操作可以参考官网提供的开发文档文章目录环信IM ...
77.4%份额，环信高居SaaS移动端客服市场第一的背后
从去年开始,SaaS客服领域迅速升温,并成为企业级应用市场里紧随CRM.人力资源.OA协同的第四座金矿.这座金矿旁边也已经占满了猎食者.究竟谁会是SaaS客服行业的最大赢家呢?近日,易观智库发布的一份 ...
Linux sdk工作的前景,环信Linux SDK测试版简直逆天高端大气上档次
万物互联时代,物联网创新方兴未艾.今日环信即时通讯云宣布环信LinuxSDK测试版正式发布,作为环信生态圈重要的布局,环信LinuxSDK测试版使用C++开发,原生支持Linux操作系统,适用于基于L ...
即时通讯行业首个《安全合规白皮书》发布
前言随着移动互联网和 5G 通信新技术的浪潮席卷全球,传统的通信方式已经发生了翻天覆地的变化.人们已经习惯了通过即时通讯软件和网络交流平台分享自己生活的方方面面,随着人们越来越公开自己的生活,人们也 ...
环信IM即时通讯集成-遇到问题及创建默认会话+默认欢迎语
环信IM--创建默认会话+默认欢迎语第一步:接入环信UI--ease-im-kit 集成版本3.7.3 环信demo中遇到的问题创建默认会话+默认欢迎语第一步:接入环信UI–ease-im-ki ...
(IM)即时通讯协议
转载自点击打开链接 1.即时通讯技术即时通讯(IM:Instant Messaging):又称实时通讯,支持用户在线实时交谈,允许两人或多人使用网络实时的传递文字消息.文件.语音与视频交流. 即时通 ...

IM即时通讯结合mui 环信

IM即时通讯结合mui 环信相关推荐

最新文章

热门文章