找回密码
 立即注册

QQ登录

只需一步,快速开始

Freya.Li
中级会员   /  发表于:2021-12-24 17:19  /   查看:2206  /  回复:0
本帖最后由 Freya.Li 于 2021-12-24 17:20 编辑

很久之前我们给大家推出过关于如何使用前端命令中腾讯云的发送短信插件实现登录页面添加发送短信验证码的功能,详情如下方教程贴。
帮你打开活字格更神奇的功能:五十五,登录页面添加短信验证码功能
https://gcdn.grapecity.com.cn/fo ... 52662&fromuid=64825
(出处: 葡萄城产品技术社区)

但是自从我们服务端命令推出了之后,细心的格友们应该看到腾讯云发送短信插件已经有一个服务端命令了~
插件传送门:点击前往查看

那么这意味着我们做短信验证更加简单了,接下来我们来一起看看怎么使用腾讯云发送短信的服务端命令来实现登录页面短信验证的功能

步骤一:找到登录页面,添加一个输入电话的文本框,添加一个输入验证码的文本框,添加一个发送按钮
image.png479198607.png

步骤二:创建服务端命令,参数是手机号
image.png924197082.png
命令中逻辑为三步,
  • 生成一个随机的6位验证码


image.png992416687.png

  • 执行腾讯云服务端发送短信的命令,其中电话号码就是入参手机号,短信的模板参数就是生成的6位验证码,其余的配置参照上方传送门插件中的讲解
image.png87283324.png

  • 之后使用返回命令,将6位验证码返回到页面上

image.png394754943.png


步骤三:在前端点击发送按钮时调用服务端命令,将返回的验证码保存到页面上的单元格
image.png204447020.png

步骤四:重写登录逻辑
在登录逻辑前添加条件判断,判断输入的验证码与返回的验证码是否一致
image.png758905029.png
image.png734312133.png


demo工程见附件,
手机验证码登录(腾讯云发送短信服务端命令).fgcc (18.12 MB, 下载次数: 677)
您需要登录后才可以回帖 登录 | 立即注册
返回顶部