js如何实现发送短信验证码,并开始倒计时,60秒内不得重发

jk 1年前 ⋅ 4574 阅读

源于:今日头条(查看原文)

相信做web开发的同学们一定都遇到过手机验证的问题,本文就是简单的介绍如何实现,如果你是web开发的老司机,请忽略此文吧。本文主要针对那些不太了解这方面知识的初级开发人员,下面开始详细说明。

整个流程

说是js发送验证码,其实真正实现发送短信功能的还是在服务器,js不过是触发发送功能。大致流程如下:

  1. 客户端js通过发送http请求(发短信接口)到服务器,将手机号等信息传递给服务器

  2. 服务器收到请求后校验参数,参数正确调用第三方短信接口,并将随机产生的验证码保存在服务器(通常是数据库或者缓存),参数错误,将错误信息返回给客户端

  3. 客户端收到服务器的返回,如果调用成功,开始倒计时同时等待用户输入收到的验证码,如果调用失败,将失败信息提示给用户。

  4. 用户输入验证码后,将验证码和手机号等信息发送到服务器校验

  5. 服务器收到校验请求后,对手机号和验证码用验证,将结果返回给客户端

  6. 客户端收到验证结果后,提示用户或者开始其他业务

简单的页面:

js如何实现发送短信验证码,并开始倒计时,60秒内不得重发

发送按钮的方法

js如何实现发送短信验证码,并开始倒计时,60秒内不得重发

倒计时方法

js如何实现发送短信验证码,并开始倒计时,60秒内不得重发

验证验证码方法

js如何实现发送短信验证码,并开始倒计时,60秒内不得重发


全部评论: 0

    我有话说: