18/10/2018, 23:31

[PHP] Hướng dẫn tích hợp Recaptcha Google vào website

Xin chào các bạn, bài viết hôm nay mình sẽ hướng dẫn các bạn cách tích hợp Recaptcha của Google vào Website. Trong lập trình web, chúng ta thường sử dụng Recaptcha cho các form đăng nhập, đăng ký hoặc post bài, để tránh trường hợp bị Spam. Recaptcha sẽ ...

Xin chào các bạn, bài viết hôm nay mình sẽ hướng dẫn các bạn cách tích hợp Recaptcha của Google vào Website.

Trong lập trình web, chúng ta thường sử dụng Recaptcha cho các form đăng nhập, đăng ký hoặc post bài, để tránh trường hợp bị Spam.

Recaptcha sẽ bảo vệ ứng dụng của mình, tránh người dùng sử dụng tool auto để đăng ký hoặc đăng bài viết hàng loạt...

hero-recaptcha-demo

Đầu tiên, chúng ta cần đăng ký Api key Recaptcha cho ứng dụng web của mình với google tại địa chỉ website bên dưới:

https://www.google.com/recaptcha/admin

google-recaptcha-register

Các bạn điền đầy đủ các thông tin của web mình vào hình ở trên, sau đó nhấn nút Register.

Sau khi đăng ký xong, google sẽ cung cấp cho chúng ta hai key: Site key và Serect key

Site key website của bạn như hình dưới:

google-recaptcha-site-key

Và hình ảnh Serect key:

google-recaptcha-secret-key

Bây giờ chúng ta sẽ tích hợp thư viện javascript của recaptcha vào website 

<script src="https://www.google.com/recaptcha/api.js" async defer></script>
  • Bây giờ chúng ta sẽ chèn Recaptcha vào form mà chúng ta cần sử dụng:

Các bạn chèn key data-sitekey mới lấy được vào code bên dưới:

<form action="" method="POST">
    <input type="text" name="name" value="" />
    <input type="text" name="email" value="" />
    <textarea type="text" name="message"></textarea>
    <div class="g-recaptcha" data-sitekey="9LDDpf0eVtMZY6kdJnGhsYYY-5ksd-W"></div>
    <input type="submit" name="submit" value="SUBMIT">
</form>

+ Tiếp theo, chúng ta sẽ tích hợp code vào PHP, khi chúng ta nhấn nút submit, trong code PHP chúng ta sẽ sử dụng Serect key để chứng thực request.

<?php
if(isset($_POST['submit']) && !empty($_POST['submit'])):
    if(isset($_POST['g-recaptcha-response']) && !empty($_POST['g-recaptcha-response'])):
        //your site secret key
        $secret = '9LuDh9kyetYYYYdT0jsVckScsH8Ks3KA';
        //get verify response data
        $verifyResponse = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret='.$secret.'&response='.$_POST['g-recaptcha-response']);
        $responseData = json_decode($verifyResponse);
        if($responseData->success):
            //contact form submission code
            $name = !empty($_POST['name'])?$_POST['name']:';
            $email = !empty($_POST['email'])?$_POST['email']:';
            $message = !empty($_POST['message'])?$_POST['message']:';
            
            $to = 'info@laptrinhvb.net';
            $subject = 'New contact form have been submitted';
            $htmlContent = "
                <h1>Contact request details</h1>
                <p><b>Name: </b>".$name."</p>
                <p><b>Email: </b>".$email."</p>
                <p><b>Message: </b>".$message."</p>
            ";
            // Always set content-type when sending HTML email
            $headers = "MIME-Version: 1.0" . "
";
            $headers .= "Content-type:text/html;charset=UTF-8" . "
";
            // More headers
            $headers .= 'From:'.$name.' <'.$email.'>' . "
";
            //send email
            @mail($to,$subject,$htmlContent,$headers);
            
            $succMsg = 'Your contact request have submitted successfully.';
        else:
            $errMsg = 'Robot verification failed, please try again.';
        endif;
    else:
        $errMsg = 'Please click on the reCAPTCHA box.';
    endif;
else:
    $errMsg = ';
    $succMsg = ';
endif;
?>

HVAE FUN :)

Tags: recaptchacaptchagoogle captcha
0