点击刷新图片验证码的原理 ---转

Posted 2020-10-12

<img src="getVerify.php" id="verifyImage">

<script>
var verifyImage = document.getElementById(‘verifyImage‘);
verifyImage.onclick = function(){
this.src=‘getVerify.php?r=‘+Math.random();
}

</script>

第一个：验证码的大致流程就是和你描述的一样的。

第二个：
生成验证码是不用往后台传值的，
你给的例子，后面的那串数字的改变其实是为了实现重新请求 URL 而已，
一般是图片链接指向生成验证码的链接，点击后使用 js 来给连接进行改变，就是后面加一串随机数，这样浏览器检测到 src 后面的连接改变了（那串随机字符串就是这个作用），然后就会重新请求后台，获取重新生成的验证码图片。

第三个：
后台返回二进制图片后，不需要生成 token ，但是需要把生成验证码的那串数字存到 session 里。要保存在服务器端，才安全，不需要返回到客户端。

第四个：
用户输入提交的验证码后，就把用户提交的验证码数字，和服务端 session 里的数字进行对比。 如果一样的话，就验证通过。

至于最后把验证码放到redis里，你可以去搜索一下，如何把 session 存到 redis 里，相关的资料。