一、建立注冊頁面
1.首先打開APICloudStudio,新建apicloud項(xiàng)目，選擇空百應(yīng)用。
2.然后寫注冊頁面，截圖如下:
二、加載短信模塊和使用短信驗(yàn)證碼功能
var isinerval, times;
var smsVerify = null;
apiready = function() {
api.parseTapmode();
smsVerify = api.require('smsVerify');
// 初始化
register();
}
// 注冊，初始化
function register() {
smsVerify.register(function(ret, err) {
if (ret.status) {
//api.alert({msg: '注冊成功'});
console.log('注冊成功');
} else {
api.alert({
msg : err.code + ' 注冊失敗'
});
}
});
}
// 發(fā)短信驗(yàn)證碼
function sms() {
var mobile = document.getElementById("mobile").value;
smsVerify.sms({
phone : mobile,
}, function(ret, err) {
if (ret.status) {
// 新增的安卓智能驗(yàn)證功能
api.alert({
msg : '短信發(fā)送成功'
});
var sendVerify = $api.byId('sendVerify');
var status = $api.attr(sendVerify, 'status');
if (status != 1) {
return;
}
$api.removeAttr(sendVerify, 'onclick');
api.parseTapmode();
$api.html(sendVerify, '<span id="GetVerify">20</span>S');
times = 19;
isinerval = setInterval("CountDown()", 1000);
} else {
api.alert({
msg : err.code + ' 短信發(fā)送失敗'
});
}
});
}
二、注冊頁面功能實(shí)現(xiàn)
1.當(dāng)點(diǎn)擊下一步的時(shí)候判斷手機(jī)號(hào) 和驗(yàn)證碼，密碼，和確認(rèn)密碼的是否為空.
寫if判斷
function next() {
var mobile = $api.byId('mobile').value;
var password = $api.byId("password").value;
var password2 = $api.byId("password2").value;
var code = $api.byId("code").value;
if ($api.byId('mobile').value.length == 0) {
$api.byId('mobile').focus();
api.toast({
msg : '手機(jī)號(hào)不能為空!'
});
return;
} else if ($api.byId('code').value.length == 0) {
$api.byId('code').focus();
api.toast({
msg : '請輸入驗(yàn)證碼!'
});
return;
} else if ($api.byId('password').value.length == 0) {
$api.byId('password').focus();
api.toast({
msg : '密碼不能為空!'
});
return;
} else if ($api.byId('password2').value.length == 0) {
$api.byId('password2').focus();
api.toast({
msg : '請輸入確認(rèn)密碼!'
});
return;
} else if ($api.byId('password').value != $api.byId('password2').value) {
$api.byId('password').focus();
api.toast({
msg : '兩次密碼不一致，請重新輸入!'
});
return;
}
2.當(dāng)驗(yàn)證碼等信息輸入正確后，會(huì)向服務(wù)器發(fā)起ajax,然后數(shù)據(jù)庫里插入注冊的數(shù)據(jù),具體代碼如下;
//html端代碼
api.ajax({
url : 'xxl',
method : 'post',
cache : false,
timeout : 30,
dataType : 'json',
data : {
values : {
mobile : mobile,
password : password
}
}
}, function(ret, err) {
if (ret.msg == 1) {
//存儲(chǔ)新注冊的用戶id到本地storage中
$api.setStorage('user_id', ret.id);
alert('注冊成功')
} else {
api.alert({
msg : ('錯(cuò)誤碼：' + err.code + '；錯(cuò)誤信息：' + err.msg + '網(wǎng)絡(luò)狀態(tài)碼：' + err.statusCode)
});
};
});
//服務(wù)端代碼
public function index() {
// echo "獲取數(shù)據(jù)中";
$mobile=json_decode($_POST['mobile']);
$password=json_decode($_POST['password']);
$users_model=M("Users");
$where['mobile']=$mobile;
$result=$users_model->where($where)->count();
if($result){
$res=array('msg'=>"手機(jī)號(hào)已經(jīng)被注冊");
echo json_encode($res);
}else{
$data=array(
'user_login' => '',
'user_email' => '',
'mobile' =>$mobile,
'user_nicename' =>'',
'user_pass' => sp_password($password),
'last_login_ip' => '',
'create_time' => date("Y-m-d H:i:s"),
'last_login_time' => date("Y-m-d H:i:s"),
'user_status' => 1,
"user_type"=>2,//會(huì)員
);
$rst = $users_model->add($data);
if($rst){
//注冊成功后頁面跳轉(zhuǎn)
$res=array('msg'=>1,'id'=>$rst);
echo json_encode($res);
}else{
$res=array('msg'=>"注冊失敗");
echo json_encode($res);
}
}
}
三、 短信功能的實(shí)現(xiàn)步驟
1、先去mob官網(wǎng)注冊帳號(hào)；
2、進(jìn)入短信管理后臺(tái)分別添加Android和iOS應(yīng)用，并獲取應(yīng)用的AppKey和AppSecret（老以前創(chuàng)建的應(yīng)用不能使用此模塊，因?yàn)榇四KSDK為2.0+，不兼容SDK1.x時(shí)代創(chuàng)建的應(yīng)用。）；
3、在APICloud應(yīng)用控制臺(tái)的模塊列表里搜索smsVerify并添加；
4、以源碼方式打開你的項(xiàng)目config.xml文件，在里面添加smsVerify模塊的配置，配置內(nèi)容為上面獲取的AppKey和AppSecret，格式如下：
1. <feature name="smsVerify">
2. <param name="android_app_key" value="xxl"/>
3. <param name="android_app_secret" value="xxl"/>
4. <param name="ios_app_key" value="xxl"/>
5. <param name="ios_app_secret" value="xxl"/>
6. </feature>
5、SVN提交源碼到APICloud的云端；
6、在 APICloud Studio 上編譯自定義loader；
7、現(xiàn)在你就可以使用smsVerify模塊進(jìn)行開發(fā)了，不過需要注意的是，<font color="#ff0000" style="word-wrap: break-word;">在調(diào)用sms、voice、verify這三個(gè)接口前，必須先調(diào)用register接口注冊應(yīng)用（調(diào)用一次就行了）；</font>
8、新版的smsVerify模塊（1.1.0及以上）sms接口Android上支持“智能驗(yàn)證”功能，可以通過回調(diào)中的 smart 參數(shù)的 true|false 進(jìn)行判斷，由于iOS不支持此功能，所以在iOS上 smart 永遠(yuǎn)返回false。智能驗(yàn)證不會(huì)下發(fā)短信，通過智能驗(yàn)證的手機(jī)號(hào)開發(fā)者可以直接讓用戶跳轉(zhuǎn)到驗(yàn)證成功的界面；
PS：驗(yàn)證碼的有效時(shí)長是5分鐘。
<font size="4" style="word-wrap: break-word;"><font color="#ff0000" style="word-wrap: break-word;">另外：iOS版上架的注意事項(xiàng)請看下面鏈接：</font></font>
http://bbs.mob.com/forum.php?mod=viewthread&tid=20580
http://wiki.mob.com/idfa%E7%9A%8 ... %E5%AE%A1%E6%A0%B8/
