這是我最近的一個項目——微信小程序 實現手機號- -驗證碼登錄，涉及到了提交參數時需要加密。加密所采用的方式也是按照要求，嚴格采用16位小加密的MD5的加密形式。

login.wxml

<view class="container"><view class="title">登錄</view><form catchsubmit="login"><view class="inputView"><input class="inputText" placeholder="請輸入手機號" maxlength="11" name="phone" bindblur="phone" /></view><view class="inputView"><input class="inputText" placeholder="請輸入驗證碼" maxlength="6" name="code" /><button class="line" disabled="{{disabled}}" size="mini" bindtap="sendcode">{{codebtn}}</button></view><view class="loginBtnView"><button class="loginBtn" formType="submit">登錄</button></view></form> </view>

login.wx

.container{display:flex;flex-direction:column;padding:0;height:100%;align-items:center;justify-content:space-between;box-sizing:border-box;padding-top: 100rpx;} .inputView{line-height:45px;border-bottom:1px solid #999} .title{width:80%;font-weight:700;font-size:30px;text-align: center;padding-bottom: 100rpx;} .inputText{display:inline-block;line-height:45px;padding-left:10px;margin-top:11px;color:#888;font-size:14px} .line{border:1px solid #ccc;border-radius:20px;float:right;margin-top:9px;color:#888;background: #ffc66c;} .loginBtn{margin-top:40px;border-radius:10px;color: #888; border:1px solid #ccc;background: #ffc66c;}

login.js

var md5 = require('../../js/md5') Page({/*** 頁面的初始數據*/data: {phone: '', //手機號初始值code: '', //驗證碼初始值codebtn: '發送驗證碼',disabled: false, //按鈕初始值可用},/*** 生命周期函數--監聽頁面加載*/onLoad: function (options) {var phone = wx.getStorageSync('phone');console.log(phone);if (phone) {this.setData({phone: phone});}},// 獲取輸入賬號 phone: function (e) {let phone = e.detail.value;let reg = /^[1][3,4,5,7,8][0-9]{9}$/;if (!reg.test(phone)) {wx.showToast({title: '手機號碼格式不正確',icon: "none",duration: 2000})return false;}this.setData({phone: e.detail.value,})},//發送驗證碼sendcode() {let that = this;var phone = this.data.phone;//時間開始var now = new Date();var yy = now.getFullYear(); //年var mm = now.getMonth() + 1; //月var dd = now.getDate(); //日var hh = now.getHours(); //時var ii = now.getMinutes(); //分var ss = now.getSeconds(); //秒var time = yyif (mm < 10) time += "0";time += mmif (dd < 10) time += "0";time += ddif (hh < 10) time += "0";time += hhif (ii < 10) time += '0';time += iiif (ss < 10) time += '0';time += ss;//時間結束let tokenday = time;var md32 = md5.hex_md5(tokenday + '#$@!*&^.www.xingyizhijiao.com/api/loginc/phonecode');console.log(md32)console.log(tokenday);var token = md32.substr(8, 16)wx.request({url: '(寫你自己需要請求的接口)',method: 'post',data: {tel: phone, //手機號token: token, //加密tokenday: tokenday, //獲取當前時間},header: {'content-type': 'application/x-www-form-urlencoded' // 默認值},success(res) {console.log(res);if (res.data.code == "1") {wx.showToast({title: '驗證碼已發送.請注意接收',icon: "success"})let time = 60;var timers = setInterval(function () {time--;if (time > 0) {that.setData({codebtn: time,disabled: true});} else {that.setData({codebtn: '發送驗證碼',disabled: false});clearInterval(timers)}}, 1000)}}})},// 登錄處理login: function (evt) {// console.log(evt);console.log(evt.detail.value);//獲得表單數據var objData = evt.detail.value;if (objData.phone) {// 同步方式存儲表單數據wx.setStorageSync('phone', objData.phone);//跳轉到成功頁面// wx.navigateTo({// url: '../index/index'// })}var that = this;let val = evt.detail.value;console.log(val)if (val.phone == "") {wx.showToast({title: '請填寫手機號碼',icon: 'none',duration: 2000})return false;}if (val.code == "" || isNaN(val.code) || val.code.length > 6) {wx.showToast({title: '驗證碼格式不正確',icon: 'none',duration: 2000})return false;} else {wx.request({url: '(寫你自己需要請求的接口)',method: 'post',data: {number: val.code, //獲取input中的驗證碼tel: val.phone, //獲取input中的手機號},header: {'content-type': 'application/x-www-form-urlencoded' // 默認值},success(res) {console.log(res);if (res.data.code == "1") {wx.switchTab({url: '/pages/index/index',})} else {wx.showToast({title: res.data.msg,icon: 'none',duration: 2000})}}})}} })

MD5.js

//MD5加密 var hexcase = 0; var b64pad = ""; var chrsz = 8; function hex_md5(s) {return binl2hex(core_md5(str2binl(s), s.length * chrsz)) } function b64_md5(s) {return binl2b64(core_md5(str2binl(s), s.length * chrsz)) } function str_md5(s) {return binl2str(core_md5(str2binl(s), s.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 hex_md5("abc") == "900150983cd24fb0d6963f7d28e17f72" } function core_md5(x, e) {x[e >> 5] |= 0x80 << ((e) % 32);x[(((e + 64) >>> 9) << 4) + 14] = e;var a = 1732584193;var b = -271733879;var c = -1732584194;var d = 271733878;for (var i = 0; i < x.length; i += 16) {var f = a;var g = b;var h = c;var j = d;a = md5_ff(a, b, c, d, x[i + 0], 7, -680876936);d = md5_ff(d, a, b, c, x[i + 1], 12, -389564586);c = md5_ff(c, d, a, b, x[i + 2], 17, 606105819);b = md5_ff(b, c, d, a, x[i + 3], 22, -1044525330);a = md5_ff(a, b, c, d, x[i + 4], 7, -176418897);d = md5_ff(d, a, b, c, x[i + 5], 12, 1200080426);c = md5_ff(c, d, a, b, x[i + 6], 17, -1473231341);b = md5_ff(b, c, d, a, x[i + 7], 22, -45705983);a = md5_ff(a, b, c, d, x[i + 8], 7, 1770035416);d = md5_ff(d, a, b, c, x[i + 9], 12, -1958414417);c = md5_ff(c, d, a, b, x[i + 10], 17, -42063);b = md5_ff(b, c, d, a, x[i + 11], 22, -1990404162);a = md5_ff(a, b, c, d, x[i + 12], 7, 1804603682);d = md5_ff(d, a, b, c, x[i + 13], 12, -40341101);c = md5_ff(c, d, a, b, x[i + 14], 17, -1502002290);b = md5_ff(b, c, d, a, x[i + 15], 22, 1236535329);a = md5_gg(a, b, c, d, x[i + 1], 5, -165796510);d = md5_gg(d, a, b, c, x[i + 6], 9, -1069501632);c = md5_gg(c, d, a, b, x[i + 11], 14, 643717713);b = md5_gg(b, c, d, a, x[i + 0], 20, -373897302);a = md5_gg(a, b, c, d, x[i + 5], 5, -701558691);d = md5_gg(d, a, b, c, x[i + 10], 9, 38016083);c = md5_gg(c, d, a, b, x[i + 15], 14, -660478335);b = md5_gg(b, c, d, a, x[i + 4], 20, -405537848);a = md5_gg(a, b, c, d, x[i + 9], 5, 568446438);d = md5_gg(d, a, b, c, x[i + 14], 9, -1019803690);c = md5_gg(c, d, a, b, x[i + 3], 14, -187363961);b = md5_gg(b, c, d, a, x[i + 8], 20, 1163531501);a = md5_gg(a, b, c, d, x[i + 13], 5, -1444681467);d = md5_gg(d, a, b, c, x[i + 2], 9, -51403784);c = md5_gg(c, d, a, b, x[i + 7], 14, 1735328473);b = md5_gg(b, c, d, a, x[i + 12], 20, -1926607734);a = md5_hh(a, b, c, d, x[i + 5], 4, -378558);d = md5_hh(d, a, b, c, x[i + 8], 11, -2022574463);c = md5_hh(c, d, a, b, x[i + 11], 16, 1839030562);b = md5_hh(b, c, d, a, x[i + 14], 23, -35309556);a = md5_hh(a, b, c, d, x[i + 1], 4, -1530992060);d = md5_hh(d, a, b, c, x[i + 4], 11, 1272893353);c = md5_hh(c, d, a, b, x[i + 7], 16, -155497632);b = md5_hh(b, c, d, a, x[i + 10], 23, -1094730640);a = md5_hh(a, b, c, d, x[i + 13], 4, 681279174);d = md5_hh(d, a, b, c, x[i + 0], 11, -358537222);c = md5_hh(c, d, a, b, x[i + 3], 16, -722521979);b = md5_hh(b, c, d, a, x[i + 6], 23, 76029189);a = md5_hh(a, b, c, d, x[i + 9], 4, -640364487);d = md5_hh(d, a, b, c, x[i + 12], 11, -421815835);c = md5_hh(c, d, a, b, x[i + 15], 16, 530742520);b = md5_hh(b, c, d, a, x[i + 2], 23, -995338651);a = md5_ii(a, b, c, d, x[i + 0], 6, -198630844);d = md5_ii(d, a, b, c, x[i + 7], 10, 1126891415);c = md5_ii(c, d, a, b, x[i + 14], 15, -1416354905);b = md5_ii(b, c, d, a, x[i + 5], 21, -57434055);a = md5_ii(a, b, c, d, x[i + 12], 6, 1700485571);d = md5_ii(d, a, b, c, x[i + 3], 10, -1894986606);c = md5_ii(c, d, a, b, x[i + 10], 15, -1051523);b = md5_ii(b, c, d, a, x[i + 1], 21, -2054922799);a = md5_ii(a, b, c, d, x[i + 8], 6, 1873313359);d = md5_ii(d, a, b, c, x[i + 15], 10, -30611744);c = md5_ii(c, d, a, b, x[i + 6], 15, -1560198380);b = md5_ii(b, c, d, a, x[i + 13], 21, 1309151649);a = md5_ii(a, b, c, d, x[i + 4], 6, -145523070);d = md5_ii(d, a, b, c, x[i + 11], 10, -1120210379);c = md5_ii(c, d, a, b, x[i + 2], 15, 718787259);b = md5_ii(b, c, d, a, x[i + 9], 21, -343485551);a = safe_add(a, f);b = safe_add(b, g);c = safe_add(c, h);d = safe_add(d, j)}return Array(a, b, c, d) } function md5_cmn(q, a, b, x, s, t) {return safe_add(bit_rol(safe_add(safe_add(a, q), safe_add(x, t)), s), b) } function md5_ff(a, b, c, d, x, s, t) {return md5_cmn((b & c) | ((~b) & d), a, b, x, s, t) } function md5_gg(a, b, c, d, x, s, t) {return md5_cmn((b & d) | (c & (~d)), a, b, x, s, t) } function md5_hh(a, b, c, d, x, s, t) {return md5_cmn(b ^ c ^ d, a, b, x, s, t) } function md5_ii(a, b, c, d, x, s, t) {return md5_cmn(c ^ (b | (~d)), a, b, x, s, t) } function core_hmac_md5(a, b) {var c = str2binl(a);if (c.length > 16) c = core_md5(c, a.length * chrsz);var d = Array(16),opad = Array(16);for (var i = 0; i < 16; i++) {d[i] = c[i] ^ 0x36363636;opad[i] = c[i] ^ 0x5C5C5C5C}var e = core_md5(d.concat(str2binl(b)), 512 + b.length * chrsz);return core_md5(opad.concat(e), 512 + 128) } function safe_add(x, y) {var a = (x & 0xFFFF) + (y & 0xFFFF);var b = (x >> 16) + (y >> 16) + (a >> 16);return (b << 16) | (a & 0xFFFF) } function bit_rol(a, b) {return (a << b) | (a >>> (32 - b)) } function str2binl(a) {var b = Array();var c = (1 << chrsz) - 1;for (var i = 0; i < a.length * chrsz; i += chrsz) b[i >> 5] |= (a.charCodeAt(i / chrsz) & c) << (i % 32);return b } function binl2str(a) {var b = "";var c = (1 << chrsz) - 1;for (var i = 0; i < a.length * 32; i += chrsz) b += String.fromCharCode((a[i >> 5] >>> (i % 32)) & c);return b } function binl2hex(a) {var b = hexcase ? "0123456789ABCDEF" : "0123456789abcdef";var c = "";for (var i = 0; i < a.length * 4; i++) {c += b.charAt((a[i >> 2] >> ((i % 4) * 8 + 4)) & 0xF) + b.charAt((a[i >> 2] >> ((i % 4) * 8)) & 0xF)}return c } function binl2b64(a) {var b = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";var c = "";for (var i = 0; i < a.length * 4; i += 3) {var d = (((a[i >> 2] >> 8 * (i % 4)) & 0xFF) << 16) | (((a[i + 1 >> 2] >> 8 * ((i + 1) % 4)) & 0xFF) << 8) | ((a[i + 2 >> 2] >> 8 * ((i + 2) % 4)) & 0xFF);for (var j = 0; j < 4; j++) {if (i * 8 + j * 6 > a.length * 32) c += b64pad;else c += b.charAt((d >> 6 * (3 - j)) & 0x3F)}}return c } String.prototype.trim = function() {return this.replace(/(^\s*)|(\s*$)/g, "") } var lastInput;function md5(a) {a = a.trim();var b = /^[0-9a-f]{16}$|^[0-9a-f]{32}$/;b.ignoreCase = true;if (b.test(a.toLowerCase())) {ctl00_ContentPlaceHolder1_LabelResult.innerHTML = ''} else {var c = hex_md5(a);ctl00_ContentPlaceHolder1_LabelResult.innerHTML = 'MD5(' + a + ',32) = ' + c + '<br>';ctl00_ContentPlaceHolder1_LabelResult.innerHTML += 'MD5(' + a + ',16) = ' + c.substr(8, 16);lastInput = a} } function CheckInput() {var a = document.all["ctl00_ContentPlaceHolder1_TextBoxq"].value;a = a.trim();var b = /^[0-9a-f]{16}$|^[0-9a-f]{32}$/;if (b.test(a.toLowerCase())) {if (lastInput + "" != "undefined") {var c = hex_md5(lastInput);if (c.indexOf(a) >= 0) {ctl00_ContentPlaceHolder1_LabelResult.innerHTML = lastInput;return false}} else {var d = ctl00_ContentPlaceHolder1_LabelResult.innerHTML;var c = hex_md5(d);if (c.indexOf(a) >= 0) {ctl00_ContentPlaceHolder1_LabelResult.innerHTML = d;return false}}ctl00_ContentPlaceHolder1_LabelResult.innerHTML = "Wait.....";return true} else {md5(a);return false} } //生成一個輸出口（應該是叫輸出口，大體意思就是形成一個可以輸出的地方） module.exports = {hex_md5: hex_md5, //需要輸出的加密算法，我這邊只寫了我用到的一種，如需用到多種可輸出多個}

總結

以上是生活随笔為你收集整理的小程序手机号验证码登录的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。