WordPress短信登录注册-part1
最后更新于:五月 26, 2019
配合监管要求，网站评论必须绑定个人手机号
一、开发前准备
- 下载腾讯云短信SDK。
- 腾讯云短信接口申请（签名、模板审核通过方可发信）。
二、创建项目文件
- 在主题目录下创建qqcloud文件夹，将下载下来的官方SDK解压到该目录
- 删除无用的SDK
demo文件夹为官方演示demo，可以仔细看一下，我们要用到的只有src文件夹下的SmsSingleSender.php，SmsSenderUtil.php这两个文件，如果你有更多的发信需求，则需要相关的sdk文件。
三、整合项目到wordpress
首先我们在qqcloud文件夹下新建php文件sms.php，内容如下
<?php
require_once __DIR__ . "/src/SmsSingleSender.php";
require_once __DIR__ . "/src/SmsSenderUtil.php";
use Qcloud\Sms\SmsSingleSender;
use Qcloud\Sms\SmsMultiSender;
use Qcloud\Sms\SmsVoiceVerifyCodeSender;
use Qcloud\Sms\SmsVoicePromptSender;
use Qcloud\Sms\SmsStatusPuller;
use Qcloud\Sms\SmsMobileStatusPuller;
use Qcloud\Sms\VoiceFileUploader;
use Qcloud\Sms\FileVoiceSender;
use Qcloud\Sms\TtsVoiceSender;
class TopicNote_Ucenter_Sms{
public function __construct() {
}
public function TopicNote_Sms_Send(){
}
}
new TopicNote_Ucenter_Sms();如果有开发能力的朋友，也可以自己封装类，下面是配合SDK发信，个人比较喜欢ajax操作，于是就直接上ajax的代码了
public function TopicNote_Sms_Send(){
$appid = '1400195640';//应用ID
$appkey = 'befc46e0ebff1071ed53af6b3380832d';//应用密钥
$phonenumbers = '18000000000';//接收验证码的手机号
$templateid = 308124;//模板ID
$smsSign = '主题笔记';//签名内容，请在腾讯云后台查看
$code = str_pad(mt_rand(10, 999999), 6, "0", STR_PAD_BOTH);//随机验证码
$ssender = new SmsSingleSender($appid, $appkey);
$params = [$code,1];
$result = $ssender->sendWithParam('86',$phonenumbers,$templateid,$params,$smsSign,'','');
$res = json_decode($result);
if($res->result == 0){
$status =1;
$message = '发送成功';
}else{
$status = 0;
$message = $res->errmsg;//如果错误获取接口错误内容
}
$arr=array(
"status"=>$status,
"message"=>$message
);
$jarr=json_encode($arr);
echo $jarr;
die();
}在项目中使用时，请注意相关验证，我这里没有做，接下来添加wp_ajax动作
public function __construct() {
add_action('wp_ajax_sms_send_action', array( $this, 'TopicNote_Sms_Send' ) );
add_action('wp_ajax_nopriv_sms_send_action', array( $this, 'TopicNote_Sms_Send' ) );
}四、jQuery操作
jQuery('.send-code').bind("click", function(e){
ctrl = jQuery(this);
$.ajax({
type: 'POST',
dataType: 'json',
url: Auth_Object.ajaxurl,//主题该地址的正确性
data: {
'action': 'sms_send_action',
"mobile": jQuery("#mobile").val(),
},
success: function(data){
if (data.status == 0) {
if (data.message) {
new Noty({
text: (data.message),
type: 'error',
layout: 'topLeft',
timeout: 5000
}).show();
}
return
}else{
new Noty({
text: (data.message),
type: 'success',
layout: 'topLeft',
timeout: 5000
}).show();
}
}
});
e.preventDefault();
});我这儿的消息通知使用了Noty.js插件，相关文章请查看
vayne五、新建页面模板
最后我们新建一个页面模板page-sms.php，内容如下
<?php
/**
* Template Name: 短信登录
*/
get_header();?>
<form id="tp_mobile" class="mobile-captcha" action="" method="post">
<div class="form-group">
<input id="mobile" class="input" name="mobile" type="text" placeholder="手机号" required />
</div>
<div class="form-group form-group-captcha">
<div class="input-group">
<input id="mobile_captcha" class="input" name="mobile_captcha" type="text" placeholder="验证码" required />
<span class="captchaBtn send-code">获取验证码</span>
</div>
</div>
</form>
<?php get_footer();?>访问页面即可，为了保证正常使用，这里需要注意ajax.url的路径。
六、阿里云短信与腾讯云短信对比
- 腾讯云SDK更精简
- 方便个人申请
写在最后
如果要实现wordpress登录注册，还需相关验证，以上代码仅仅是实现ajax发信。后期笔记会出一款wordpress手机登录注册插件或者在topic-ucenter插件中整合此功能，有需要的朋友可以关注一下