生活随笔
收集整理的这篇文章主要介绍了
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 环信的全部内容，希望文章能够帮你解决所遇到的问题。
如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。
