微信小程序发送验证码

记录一下，小程序发送验证码的小案例。废话不多说，直接撸代码。。。

1、效果图如下

wxml:

</view>

</view>

</view>

js:

var interval = null //倒计时函数

const app = getApp();

Page({

data: {

time: '获取验证码', //倒计时

currentTime: 61,

disabled: false, //可点击

mobile: "",

yzm: ""

mInput: function(e) {

this.setData({

mobile: e.detail.value

})

vInput:function(e){

this.setData({

yzm: e.detail.value

})

//获取验证码，倒计时

getCode: function(mobile) {

var that = this;

var params = {

sms_type: 1,

mobile: mobile

};

wx.request({

url: app.globalData.u + "/send_verification_code.do",

data: params,

method: "get",

header: {

"content-type": "application/json"

dataType: "json",

success: function success(res) {

if (res.data.result_code == "0") {

wx.showToast({

title: '验证码发送成功'

})

//倒计时

var currentTime = that.data.currentTime

interval = setInterval(function() {

currentTime--;

that.setData({

time: currentTime + ' 秒'

})

if (currentTime <= 0) {

clearInterval(interval)

that.setData({

time: '重新获取',

currentTime: 61,

disabled: false

})

}

}, 1000)

} else {

wx.showModal({

title: "",

content: res.data.err_msg

});

that.setData({

time:'获取验证码',

disabled:false

})

}

fail: function fail(res) {

wx.showModal({

content: res

});

}

getVCode() {

//校验手机号

let mobile = this.data.mobile

var regMobile = /^1[3456789]\d{9}$/;

if (!regMobile.test(mobile)) {

wx.showModal({

title: '',

content: '手机格式错误',

})

return;

}

this.getCode(mobile);

this.setData({

disabled: true

})

//绑定

bd: function() {

let mobile = this.data.mobile

let yzm = this.data.yzm

//校验手机号、验证码

var regMobile = /^1[3456789]\d{9}$/;

if (!regMobile.test(mobile)) {

wx.showModal({

title: '',

content: '手机格式错误',

})

return;

}

if (yzm == '') {

wx.showModal({

title: '',

content: '验证码不能为空',

})

return;

}

this.updateUserMobile(mobile,yzm);

updateUserMobile: function (mobile, verifiy_code) {

var params = {

user_id: app.globalData.userInfo.user_id,

mobile: mobile,

verifiy_code: verifiy_code

};

// console.log(params)

wx.request({

url: app.globalData.u + 'update_user_mobile.do',

data: params,

method: 'post',

header: {

'content-type': 'application/x-www-form-urlencoded'

dataType: 'json',

success: function success(res) {

console.log(res)

if (res.data.result_code == '0') {

// wx.showToast({

// title: '绑定成功',

// icon: 'success',

// duration: 1000

// })

setTimeout(function(){

wx.redirectTo({

url: 'ziliao',

})

},1500)

} else {

wx.showModal({

title: '',

content: res.data.err_msg

});

}

fail: function fail(res) {

wx.showModal({

content: '服务器发生异常，请稍后再试'

});

}

})

微信小程序发送验证码相关推荐

微信小程序发送验证码60秒倒计时
wxml <view class="li-send" bindtap="onSend" wx:if="{{send}}">发送验 ...
微信小程序，验证码输入框
微信小程序,验证码输入效果预览写了个小程序验证码输入的小demo,用的方法是比较猥琐的隐藏input框,输入内容绑定的方法 wxml代码 <view class="wx-page- ...
微信小程序-动态验证码
微信小程序-动态验证码一.创建自定义组件verification-code 二.在index页面使用一.创建自定义组件verification-code verification-code.js ...
java后台接收微信小程序发送的post请求参数
java后台接收微信小程序发送的post请求参数 // 微信端:data数据要加上JSON转换JSON.stringify() wx.request({url: 'http://127.0.0.1:8 ...
php+实现群发微信模板消息_使用php实现微信小程序发送模板消息（附代码）
本篇文章给大家带来的内容是关于使用php实现微信小程序发送模板消息(附代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 本章将会简单说一下微信小程序的模板消息发送,相对来说比较简 ...
微信小程序 - 发送视频弹幕
微信小程序 - 发送视频弹幕微信小程序官方文档提供了发送视频弹幕的功能,参照其功能做了一些改动,实现可发送用户自定义颜色的弹幕. function getRandomColor() {var rgb ...
【微信小程序 - 工作实战分享】1.微信小程序发送手机短信验证码（阿里云）
发送手机短信验证码前言一. 准备工作二. 配置三. 实战代码(仅仅是后台代码,前端传入手机号) 总结前言在网站和移动应用中利用短信验证码进行信息确认是最常用的验证手段.随着短信验证码的技术 ...
微信小程序授权_微信小程序授权验证码什么意思
首先,最先要进行的便是运行微信软件,然后在软件的主界面中,找到"发现"这一功能项目.1.点击"发现"界面之后,会看到一个"游戏中心"的选项, ...
微信小程序发送模板消息，php发送模板消息
微信小程序开发交流qq群 173683895 承接微信小程序开发.扫码加微信. formId 在安卓系统是纯数字,在IOS系统是一串加密字符,如图: 发送模板消息(服务通知)效果图: 前端 ...

微信小程序发送验证码

微信小程序发送验证码相关推荐

最新文章

热门文章