点击获取验证码并登录的实现和验证原理

最新推荐文章于 2024-06-04 10:02:01 发布

舞空~

最新推荐文章于 2024-06-04 10:02:01 发布

阅读量5.5k

点赞数 2

分类专栏： vue js 文章标签： vue javascript

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/weixin_44011751/article/details/114749669

版权

vue 同时被 2 个专栏收录

27 篇文章 2 订阅

订阅专栏

22 篇文章 0 订阅

订阅专栏

1.效果如图,一开始有个验证码,点击验证码就更新一个新的验证码

在这里插入图片描述

2.验证码其实就是一个图片,图片根据后面拼接的随机数的不同生成不同的图片,这个后端的事情,我们只需要在用户点击验证码时修改验证码图片地址即可,至于提交时的验证只需要将图片地址和随机数传到接口,后端接口会验证,我们只需要根据结果进行下一步操作即可

在这里插入图片描述

3.上面就初始化了一张二维码,下面实现点击更换二维码,这个很简单,只需要更改这个随机数即可

在这里插入图片描述

下面就是点击登录时验证了,我们只需要传用户输入的二维码即上图的this.checkCode和随机数this.random作为参数,后端依据这两个值去判断你输入的验证码是否正确

在这里插入图片描述

因为实现验证码代码不多,都在图上,在此就不附上源码了

希望文档能帮助到您,最后求个赞,谢谢~

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
点击获取验证码并登录的实现和验证原理

验证码其实就是一个图片,图片根据后面拼接的随机数的不同生成不同的图片,这个后端的事情,我们只需要在用户点击验证码时修改验证码图片地址即可
复制链接

扫一扫

专栏目录

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。