生活随笔
收集整理的這篇文章主要介紹了
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 环信的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
