下面这个验证码代码是一个典型的PHP验证码生成脚本,它的设计和实现都比较规范和实用。验证码的生成过程通过随机选取字符数组中的元素来实现,并且每次生成都会重新随机选择,这增加了验证码的不可预测性。同时,在图片上添加了干扰点,使得验证码更难以被机器识别,增强了安全性。
新建index.html吧下面代码复制进去
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>验证码验证</title>
</head>
<body>
<form id="verifyForm">
<label for="verifyCode">请输入验证码:</label>
<input type="text" id="verifyCodeInput" name="verifyCode">
<img id="verifyImage" src="generate_captcha.php" alt="验证码">
<button type="button" onclick="verifyCaptcha()">验证</button>
</form>
<script>
function verifyCaptcha() {
var userInput = document.getElementById('verifyCodeInput').value;
// 发送验证码验证请求
var xhr = new XMLHttpRequest();
xhr.open('POST', 'verify_captcha.php', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
var response = xhr.responseText;
if (response == 'success') {
alert('验证码验证成功!');
} else {
alert('验证码验证失败!');
document.getElementById('verifyImage').src = 'generate_captcha.php?' + Math.random(); // 刷新验证码图片
}
}
};
xhr.send('verifyCode=' + userInput);
}
</script>
</body>
</html>
新建verify_captcha.php文件
<?php
session_start();
$verifyCode = $_SESSION['verifycode'];
$userInput = $_POST['verifyCode'];
if ($verifyCode == $userInput) {
echo 'success';
} else {
echo 'fail';
}
?>
新建generate_captcha.php将下面二维码api代码放进去就行了。
请登录后发表评论
注册
请登录后查看评论内容