功能:php后端生成随机验证码,并生成验证码图片,前端img的src属性指向该文件获取图片
1.php后端随机生成一个字符串并设置该php文件,使用echo输出字符串,利用GD库生成验证码图片并以图片文件的形式保存在服务器中;
2.前端通过axios库的$.get请求得到1中生成的验证码,img的src设置为1中的图片的URL即可;
3.验证码的刷新:每次点击验证码,src后面加上一个随机的参数即可
$.get("http://phpstudy:8000/%E8%AE%BA%E5%9D%9B%E5%90%8E%E5%8F%B0%E7%AE%A1%E7%90%86/%E9%AA%8C%E8%AF%81%E7%A0%81/code.php?" + Math.random(), function(
data, status) {
app.code = data;
console.log(app.code);
})
setTimeout(function() {
app.codeUrl = "http://phpstudy:8000/%E8%AE%BA%E5%9D%9B%E5%90%8E%E5%8F%B0%E7%AE%A1%E7%90%86/%E9%AA%8C%E8%AF%81%E7%A0%81/code.png?" + Math.random();
// $("#code").Attr("src","http://phpstudy:8000/%E8%AE%BA%E5%9D%9B%E5%90%8E%E5%8F%B0%E7%AE%A1%E7%90%86/%E9%AA%8C%E8%AF%81%E7%A0%81/code.php");
}, 100)