Google reCAPTCHA Integration in PHP
Last Updated :
04 Apr, 2022
In this article, we are going to discuss how to integrate Google reCAPTCHA v2 in PHP.
Approach:
- Register your site at Google reCAPTCHA
- Submit HTML form
- Get response key at server side
- Re-verify the key and give response to user end.
Step 1: Register your site at Google reCAPTCHA — Register your website at Google reCAPTCHA platform to get keys i.e. Site key and Secret key needed to code the HTML form.
Click here to go to Google reCAPTCHA website.
Demo to Register site at Google reCAPTCHA
Step 2: Creating Google reCAPTCHA form in HTML — Here, we are going to create a simple HTML form with action as action.php, one input field, and a button. Meanwhile, we need to add Google reCAPTCHA CDN link in our HTML document and a div tag in the form to get reCAPTCHA in the HTML document.
CDN Link: <script src=”https://www.google.com/recaptcha/api.js” async defer></script>
Div Tag: <div class=”g-recaptcha” data-sitekey=”your_site_key”></div>
Note: You need to replace “your_site_key” with your Site Key.
Example:
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" >
< link rel = "stylesheet" href = "style.css" >
< script src =
</ script >
</ head >
< body >
< div class = "container" >
< h1 >Google reCAPTCHA</ h1 >
< form action = "action.php" method = "post" >
< input type = "text" name = "name" id = "name"
placeholder = "Enter Name" required>
< br >
< div class = "g-recaptcha"
data-sitekey = "your_site_key" >
</ div >
< br >
< button type = "submit" name = "submit_btn" >
Submit
</ button >
</ form >
</ div >
</ body >
</ html >
|
style.css
.container {
border : 1px solid rgb ( 73 , 72 , 72 );
border-radius: 10px ;
margin : auto ;
padding : 10px ;
text-align : center ;
}
h 1 {
margin-top : 10px ;
}
input[type= "text" ] {
padding : 10px ;
border-radius: 5px ;
margin : 10px ;
font-family : "Times New Roman" , Times, serif ;
font-size : larger ;
}
button {
border-radius: 5px ;
padding : 10px ;
color : #fff ;
background-color : #167deb ;
border-color : #0062cc ;
font-weight : bolder ;
cursor : pointer ;
}
button:hover {
text-decoration : none ;
background-color : #0069d9 ;
border-color : #0062cc ;
}
.g-recaptcha {
margin-left : 513px ;
}
|
Step 3: PHP Back end — We have successfully submitted the HTML form, now it’s time to code PHP back-end. After the submission of form, at the server-side, we are checking that the valid form is submitted or not by using the “isset()” function. After the validation, we fetched the name in $name variable and Google recaptcha response in $recaptcha variable.
Code snippet:
PHP
<?php
if (isset( $_POST [ 'submit_btn' ])) {
$name = $_POST [ 'name' ];
$recaptcha = $_POST [ 'g-recaptcha-response' ];
}
?>
|
Step 4: Verify the captcha – In order to verify the captcha, we need to make a post request to the following URL.
- URL: https://www.google.com/recaptcha/api/siteverify?secret=<secret_key>&response=<response_key>
- secret_key: This key you will get from Google console i.e. Secret Key.
- response_key: This key comes from the client-side when a user submits the form.
- g-recaptcha-response is the name of response key that browser will generate upon form submit. If its blank or null means user has not selected the captcha, so return the error.
- Your need to replace “your_secret_key” with your Secret Key.
action.php
<?php
if (isset( $_POST [ 'submit_btn' ])) {
$name = $_POST [ 'name' ];
$recaptcha = $_POST [ 'g-recaptcha-response' ];
$secret_key = 'your_secret_key' ;
. $secret_key . '&response=' . $recaptcha ;
$response = file_get_contents ( $url );
$response = json_decode( $response );
if ( $response ->success == true) {
echo '<script>alert("Google reCAPTACHA verified")</script>' ;
} else {
echo '<script>alert("Error in Google reCAPTACHA")</script>' ;
}
}
?>
|
Output:
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...