简单实现PHP网页图片验证码示例-酷库博客

下面这个验证码代码是一个典型的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代码放进去就行了。