前端样式
.wxml文件
<view class="body"><form bindsubmit="formSubmit"><view class="password"><view class="one">手机号码</view><view class="two">{{mobile}}</view><view class="send" bindtap="sendMsg" wx:if="{{send}}">发送</view><view class="count_down" wx:else>{{second+'s'}}</view></view><view class="password"><view class="one">短信验证</view><input type="number" name='code' class="two" placeholder="短信验证码" maxlength="6" value="" /></view><view class="password"><view class="one">新密码</view><input type="number" name="newPassword" class="two" password="{{true}}" placeholder="必须是6位数字" maxlength="6" value="{{password.newPassword}}" /></view><view class="password"><view class="one">确认密码</view><input type="number" name="cfmPassword" class="two" password="{{true}}" placeholder="必须是6位数字" maxlength="6" value="{{password.cfmPassword}}" /></view><button class="submit" disabled="{{!send}}" form-type="submit">确定</button></form></view>
.js文件
const urlList = require('../../../utils/api.js');const hash = require('../../../utils/md5.js');const app = getApp();Page({/*** 页面的初始数据*/data: {mobile:'',send:true,//是否发送,还是显示倒计时。true:发送second:60,url:'',},/*** 生命周期函数--监听页面加载*/onLoad: function (e) {var that = this;if (e.path){that.setData({url: e.path})}that.setData({mobile: app.globalData.userInfoData.mobile})},/*** 生命周期函数--监听页面显示*/onShow: function () {},//发送验证码sendMsg:function(){var that = this;wx.request({url: urlList.sendCode,method: "GET",header: {sign: app.globalData.authKey,},success: function (res) {if (res.data.code == 1) {wx.showToast({title: res.data.msg,icon: 'success',duration: 2000});}else{wx.showToast({title: res.data.msg,image: '/images/error.png',duration: 1000});wx.navigateBack({url: '/' + that.data.url,})return false;}}});that.setData({send: false,})that.timer();},formSubmit:function(e){var that = this;var code = e.detail.value.code;var newPassword = e.detail.value.newPassword;var cfmPassword = e.detail.value.cfmPassword;var patten = /^[0-9]{6}$/;if (newPassword != cfmPassword) {wx.showToast({title: '密码不一致!',image: '/images/error.png',duration: 1000});return false;}var patten = /^[0-9]{6}$/;if (!patten.test(newPassword)) {wx.showToast({title: '必须6位数字',image: '/images/error.png',duration: 1000});return;}if (!patten.test(code)) {wx.showToast({title: '验证码错误',image: '/images/error.png',duration: 1000});return;}var param = {code:code,payPassword: hash.hexMD5(newPassword),}wx.request({url: urlList.findPwd,data: param,method: "POST",header: {sign: app.globalData.authKey,},success: function (res) {if (res.data.code == 1) {wx.showToast({title: res.data.msg,icon: 'success',duration: 2000});setTimeout(function () {wx.navigateBack({url: '/' + that.data.url,})}, 1000);} else {wx.showToast({title: res.data.msg,image: '/images/error.png',duration: 1000});return false;}}});},//倒计时timer: function () {let promise = new Promise((resolve, reject) => {let setTimer = setInterval(() => {this.setData({second: this.data.second - 1})if (this.data.second <= 0) {this.setData({second: 60,send: true})resolve(setTimer)}}, 1000)})promise.then((setTimer) => {clearInterval(setTimer)})},})
涉及到的md5.js文件(我已经压缩过了,直接复制粘贴就行)
function hex_md5(a) {return binl2hex(core_md5(str2binl(a), a.length * chrsz)) } function b64_md5(a) {return binl2b64(core_md5(str2binl(a), a.length * chrsz)) } function str_md5(a) {return binl2str(core_md5(str2binl(a), a.length * chrsz)) } function hex_hmac_md5(a, b) {return binl2hex(core_hmac_md5(a, b)) } function b64_hmac_md5(a, b) {return binl2b64(core_hmac_md5(a, b)) } function str_hmac_md5(a, b) {return binl2str(core_hmac_md5(a, b)) } function md5_vm_test() {return "900150983cd24fb0d6963f7d28e17f72" == hex_md5("abc") } function core_md5(a, b) {var c, d, e, f, g, h, i, j, k; for (a[b >> 5] |= 128 << b % 32, a[(b + 64 >>> 9 << 4) + 14] = b, c = 1732584193, d = -271733879, e = -1732584194, f = 271733878, g = 0; g < a.length; g += 16)h = c, i = d, j = e, k = f, c = md5_ff(c, d, e, f, a[g + 0], 7, -680876936), f = md5_ff(f, c, d, e, a[g + 1], 12, -389564586), e = md5_ff(e, f, c, d, a[g + 2], 17, 606105819), d = md5_ff(d, e, f, c, a[g + 3], 22, -1044525330), c = md5_ff(c, d, e, f, a[g + 4], 7, -176418897), f = md5_ff(f, c, d, e, a[g + 5], 12, 1200080426), e = md5_ff(e, f, c, d, a[g + 6], 17, -1473231341), d = md5_ff(d, e, f, c, a[g + 7], 22, -45705983), c = md5_ff(c, d, e, f, a[g + 8], 7, 1770035416), f = md5_ff(f, c, d, e, a[g + 9], 12, -1958414417), e = md5_ff(e, f, c, d, a[g + 10], 17, -42063), d = md5_ff(d, e, f, c, a[g + 11], 22, -1990404162), c = md5_ff(c, d, e, f, a[g + 12], 7, 1804603682), f = md5_ff(f, c, d, e, a[g + 13], 12, -40341101), e = md5_ff(e, f, c, d, a[g + 14], 17, -1502002290), d = md5_ff(d, e, f, c, a[g + 15], 22, 1236535329), c = md5_gg(c, d, e, f, a[g + 1], 5, -165796510), f = md5_gg(f, c, d, e, a[g + 6], 9, -1069501632), e = md5_gg(e, f, c, d, a[g + 11], 14, 643717713), d = md5_gg(d, e, f, c, a[g + 0], 20, -373897302), c = md5_gg(c, d, e, f, a[g + 5], 5, -701558691), f = md5_gg(f, c, d, e, a[g + 10], 9, 38016083), e = md5_gg(e, f, c, d, a[g + 15], 14, -660478335), d = md5_gg(d, e, f, c, a[g + 4], 20, -405537848), c = md5_gg(c, d, e, f, a[g + 9], 5, 568446438), f = md5_gg(f, c, d, e, a[g + 14], 9, -1019803690), e = md5_gg(e, f, c, d, a[g + 3], 14, -187363961), d = md5_gg(d, e, f, c, a[g + 8], 20, 1163531501), c = md5_gg(c, d, e, f, a[g + 13], 5, -1444681467), f = md5_gg(f, c, d, e, a[g + 2], 9, -51403784), e = md5_gg(e, f, c, d, a[g + 7], 14, 1735328473), d = md5_gg(d, e, f, c, a[g + 12], 20, -1926607734), c = md5_hh(c, d, e, f, a[g + 5], 4, -378558), f = md5_hh(f, c, d, e, a[g + 8], 11, -574463), e = md5_hh(e, f, c, d, a[g + 11], 16, 1839030562), d = md5_hh(d, e, f, c, a[g + 14], 23, -35309556), c = md5_hh(c, d, e, f, a[g + 1], 4, -1530992060), f = md5_hh(f, c, d, e, a[g + 4], 11, 1272893353), e = md5_hh(e, f, c, d, a[g + 7], 16, -155497632), d = md5_hh(d, e, f, c, a[g + 10], 23, -1094730640), c = md5_hh(c, d, e, f, a[g + 13], 4, 681279174), f = md5_hh(f, c, d, e, a[g + 0], 11, -358537222), e = md5_hh(e, f, c, d, a[g + 3], 16, -722521979), d = md5_hh(d, e, f, c, a[g + 6], 23, 76029189), c = md5_hh(c, d, e, f, a[g + 9], 4, -640364487), f = md5_hh(f, c, d, e, a[g + 12], 11, -421815835), e = md5_hh(e, f, c, d, a[g + 15], 16, 530742520), d = md5_hh(d, e, f, c, a[g + 2], 23, -995338651), c = md5_ii(c, d, e, f, a[g + 0], 6, -198630844), f = md5_ii(f, c, d, e, a[g + 7], 10, 1126891415), e = md5_ii(e, f, c, d, a[g + 14], 15, -1416354905), d = md5_ii(d, e, f, c, a[g + 5], 21, -57434055), c = md5_ii(c, d, e, f, a[g + 12], 6, 1700485571), f = md5_ii(f, c, d, e, a[g + 3], 10, -1894986606), e = md5_ii(e, f, c, d, a[g + 10], 15, -1051523), d = md5_ii(d, e, f, c, a[g + 1], 21, -2054922799), c = md5_ii(c, d, e, f, a[g + 8], 6, 1873313359), f = md5_ii(f, c, d, e, a[g + 15], 10, -30611744), e = md5_ii(e, f, c, d, a[g + 6], 15, -1560198380), d = md5_ii(d, e, f, c, a[g + 13], 21, 1309151649), c = md5_ii(c, d, e, f, a[g + 4], 6, -145523070), f = md5_ii(f, c, d, e, a[g + 11], 10, -110379), e = md5_ii(e, f, c, d, a[g + 2], 15, 718787259), d = md5_ii(d, e, f, c, a[g + 9], 21, -343485551), c = safe_add(c, h), d = safe_add(d, i), e = safe_add(e, j), f = safe_add(f, k); return Array(c, d, e, f) } function md5_cmn(a, b, c, d, e, f) {return safe_add(bit_rol(safe_add(safe_add(b, a), safe_add(d, f)), e), c) } function md5_ff(a, b, c, d, e, f, g) {return md5_cmn(b & c | ~b & d, a, b, e, f, g) } function md5_gg(a, b, c, d, e, f, g) {return md5_cmn(b & d | c & ~d, a, b, e, f, g) } function md5_hh(a, b, c, d, e, f, g) {return md5_cmn(b ^ c ^ d, a, b, e, f, g) } function md5_ii(a, b, c, d, e, f, g) {return md5_cmn(c ^ (b | ~d), a, b, e, f, g) } function core_hmac_md5(a, b) {var d, e, f, g, c = str2binl(a); for (c.length > 16 && (c = core_md5(c, a.length * chrsz)), d = Array(16), e = Array(16), f = 0; 16 > f; f++)d[f] = 909522486 ^ c[f], e[f] = 1549556828 ^ c[f]; return g = core_md5(d.concat(str2binl(b)), 512 + b.length * chrsz), core_md5(e.concat(g), 640) } function safe_add(a, b) {var c = (65535 & a) + (65535 & b), d = (a >> 16) + (b >> 16) + (c >> 16); return d << 16 | 65535 & c } function bit_rol(a, b) {return a << b | a >>> 32 - b } function str2binl(a) {var d, b = Array(), c = (1 << chrsz) - 1; for (d = 0; d < a.length * chrsz; d += chrsz)b[d >> 5] |= (a.charCodeAt(d / chrsz) & c) << d % 32; return b } function binl2str(a) {var d, b = "", c = (1 << chrsz) - 1; for (d = 0; d < 32 * a.length; d += chrsz)b += String.fromCharCode(a[d >> 5] >>> d % 32 & c); return b } function binl2hex(a) {var d, b = hexcase ? "0123456789ABCDEF" : "0123456789abcdef", c = ""; for (d = 0; d < 4 * a.length; d++)c += b.charAt(15 & a[d >> 2] >> 8 * (d % 4) + 4) + b.charAt(15 & a[d >> 2] >> 8 * (d % 4)); return c } function binl2b64(a) {var d, e, f, b = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/", c = ""; for (d = 0; d < 4 * a.length; d += 3)for (e = (255 & a[d >> 2] >> 8 * (d % 4)) << 16 | (255 & a[d + 1 >> 2] >> 8 * ((d + 1) % 4)) << 8 | 255 & a[d + 2 >> 2] >> 8 * ((d + 2) % 4), f = 0; 4 > f; f++)c += 8 * d + 6 * f > 32 * a.length ? b64pad : b.charAt(63 & e >> 6 * (3 - f)); return c } var hexcase = 0, b64pad = "", chrsz = 8; module.exports = {hexMD5: hex_md5, b64Md5: b64_md5 };
涉及到的api.js
const urlList = {baseUrl:'https://************',//修改密码-发送验证码sendCode: basePath + '/user/send',//修改密码-提交findPwd:basePath + '/user/findPassword'};module.exports = urlList;
后端的处理
//namespace App\Helpers;/*** 统一返回信息* @param $code* @param $data* @param $msge*/function msg($code, $data, $msg){return compact('code', 'data', 'msg');}
//支付密码设置-发送验证码Route::get('/user/send','User@sendCode');//支付密码设置-找回密码提交操作Route::post('/user/findPassword','User@findPassword');
//发送短信验证码public function sendCode(Request $request){$uid = $request->get('uid');//需要用到的用户id$userInfo = YjUsers::where(['uid' => $uid,'status' => 1])->select('mobile')->first();//yjuser是我自己的用户表,去查用户的手机号(这个手机号我没有从前端传递过来,因为我前端传递过来一个用户的信息,可以知道用户的id,直接用id去查的用户的手机号)if(!isset($userInfo->mobile)){//最好不好用(!$userInfo->mobile)这个来直接判断,会报错的return Response()->json(msg(0,[],'用户手机号不存在'));}$smsLog=(new YjSmsLog())->sendMobileVerifyCode($userInfo->mobile);return $smsLog;}
现在去找sendMobileVerifyCode()这个方法
public function sendMobileVerifyCode($mobile){$scene = $this->Scene(2);//修改密码$smsTemplate=$this->getSmsTemplateByScene($scene);//去下边找这个方法!自己的数据库中存在着从阿里云申请的短信模板$session_id=md5(time().mt_rand(1,999999999));//没啥用的$code = rand(100000, 999999);$param=array('mobile'=>$mobile,'sms_sign'=>$smsTemplate['sms_sign'],'sms_tpl_code'=>$smsTemplate['sms_tpl_code'],'code'=>$code);$response = Sms::send($param);$data=['mobile'=>$mobile,'session_id'=>$session_id,'code'=>$code,'status'=>1,'scene'=>2,'addtime'=>time(),'error_msg'=>$response['Message'] == 'OK' ? '' : $response['Message'],];$this->addSmsLog($data);//记录发短信记录表if('OK' == $response['Code']){return Response()->json(msg(1,[] , '验证码发送成功'));}return Response()->json(msg(-2,[] , '验证码发送失败'));}
public function getSmsTemplateByScene($scene){return YjSmsTemplate::where(['send_scene' => $scene])->first();//把阿里云的短信模板放到了数据库中了}
public function addSmsLog($param){try{$result = YjSmsLog::create($param);if(!isset($result->id)){// 验证失败 输出错误信息return Response()->json(msg(-1, '', $this->getError()));}else{return Response()->json(msg(1, $result, '保存成功'));}}catch (\Exception $e){return Response()->json(msg(-2, '', $e->getMessage()));}}
短信用的是这个扩展
/document_detail/112186.html?spm=a2c4g.11186623.4.1.68b016e4EHBspc
你直接composer,然后改改参数就可以用
composer require alibabacloud/client
那两个文件
sendsms.php如下:
<?php/*** Created by PhpStorm.* User: ranhai* Date: /5/6* Time: 2:30 PM*/namespace App\Service\Sms;use AlibabaCloud\Client\AlibabaCloud;use AlibabaCloud\Client\Exception\ClientException;use AlibabaCloud\Client\Exception\ServerException;use Illuminate\Support\Facades\Log;class SendSms{//初始化短信接口public function init(){$key = env('AibabaSMSAcceccKey');//这个不用我教了吧。。$secret = env('AibabaSMSAccessKeySecret');//这个不用我教了吧。。AlibabaCloud::accessKeyClient($key,$secret)->asDefaultClient();}/**** PhoneNumbers:手机号* SignName:签名* TemplateCode:模板码* TemplateParam:参数***/public function send($query){$this->init();try {$result = AlibabaCloud::rpc()->regionId('cn-hangzhou')->product('Dysmsapi')->version('-05-25')->action('SendSms')->method('POST')->options(['query' => $query,])->request();$respone = $result->toArray();Log::info('sendInfo:'.json_encode($respone));return $respone;} catch (ClientException $exception) {$error = $exception->getErrorMessage();Log::info('smsError:'.json_encode($error));return false;} catch (ServerException $exception) {$error = $exception->getErrorMessage();Log::info('smsError:'.json_encode($error));return false;}}}
sms.php如下
<?php/*** Created by PhpStorm.* User: ranhai* Date: /5/6* Time: 4:18 PM*/namespace App\Service\Sms;use Illuminate\Support\Facades\Cache;/***** 验证码服务类* 后续很多功能待完善****/class Sms{public static function send($param){$phone = $param['mobile'];$code = $param['code'];$query = ['PhoneNumbers' => $phone,'SignName' => $param['sms_sign'],'TemplateCode' => $param['sms_tpl_code'],'TemplateParam' => json_encode(['code' => $code]),];$result = (new SendSms())->send($query);self::cacheCode($phone,$code);return $result;}protected static function cacheCode($phone,$code){$key = $phone;Cache::put($key,$code,5);return true;}//检测验证码是否正确public static function checkCode($phone,$code){$key = $phone;if(!Cache::has($key)){return false;}$cacheCode = Cache::pull($phone);return $cacheCode == $code;}}