WordPress表单如何添加验证码

Published
2023-08-12
浏览次数 :  42

首先创建生成随机数字:

function generate_verification_code($length = 6) {
    $characters = '0123456789';
    $verification_code = '';
    for ($i = 0; $i < $length; $i++) {
        $verification_code .= $characters[rand(0, strlen($characters) - 1)];
    }
    return $verification_code;
}

创建随机数字的图片:

function generate_verification_image($verification_code) {
    $image = imagecreatetruecolor(200, 75);
    $bg_color = imagecolorallocate($image, 255, 255, 255);
    $text_color = imagecolorallocate($image, 0, 0, 0);
    imagefill($image, 0, 0, $bg_color);

    // Use a font that's available on your system
    $font_size = 30;
    
    $font_path = get_template_directory() . '/css/webfonts/fa-brands-400.ttf';

    imagettftext($image, $font_size, 0, 10, 50, $text_color, $font_path, $verification_code);

    // Get the uploads directory information
    $upload_dir_info = wp_upload_dir();
    $image_path = $upload_dir_info['basedir'] . '/' . uniqid() . '.png'; // Adjust the path

    imagepng($image, $image_path);
    imagedestroy($image);

    $image_url = str_replace($upload_dir_info['basedir'], $upload_dir_info['baseurl'], $image_path);
    return $image_url; // Return the URL of the generated image
}

在form里面执行函数:

<label for="user_verification_code">Enter the Verification Code:</label>
    <img src="<?php echo $verification_image_url; ?>" alt="Verification Code">
    <input type="hidden" name="actual_verification_code" value="<?php echo $verification_code; ?>">
    <input type="text" name="user_verification_code" required>

这样form里面就会生成随机数字的图片。 <input type=”text” name=”user_verification_code” required> 这里输入随机数字,在php后端进行验证:

 $actual_verification_code = $data->get_param('actual_verification_code');
    $user_verification_code = $data->get_param('user_verification_code');

    if ($actual_verification_code === $user_verification_code) {
        // Verification code is valid, process the form
        $table_name = $wpdb->prefix . 'message_form_data';
    $title = sanitize_text_field( $data['title'] );
    $contacts = sanitize_text_field( $data['contacts'] );
    $mobile = sanitize_text_field( $data['mobile'] );
    $email = sanitize_email( $data['email'] );
    $content = sanitize_textarea_field( $data['content'] );

    $wpdb->insert(
        $table_name,
        array(
            'id' => $title,
            'name' => $contacts,
            'phone' => $mobile,
            'email' => $email,
            'details' => $content,

        )
    );

我这里form是通过rest api提交的,自定义路由,然后通过路由的callback 函数执行数据库的操作。


标签:
Top