How to Implement Google reCaptcha in PHP Form

hello friends in this video tutorial we are going to learn how to implement Google reCAPTCHA in PHP form and how to validate by using Ajax in previous part we have seen how can we make custom captcha and integrate in our PHP form and validate CAPTCHA code using Ajax now here we will implement Google reCAPTCHA in PHP form currently reCAPTCHA version 3 has been used for check input fields has been filled by human because this Google reCAPTCHA query has been only solved by human and it will protects your website from spam so here we have discussing this tutorial now let's start discussing this tutorial so first we want to get Google reCAPTCHA side key and secret key for this you have Google account so here we have login into Google account after login into Google account now we have searched Google reCAPTCHA so here we can seen search result here we have click on this link here we have go to admin console and so this page has been loaded here in label field we have enter label name captcha code after this we have select reCAPTCHA version two and then after we have to define domain name so here we have used this code in localhost so here we have write localhost and lastly click on button after click on button here on web page we can see site key and secret key we have copy both copy for our future use now we have go to our working folder first we have opened index.php file in this file we have already imported jQuery and bootstrap library and here also we have also imported Google reCAPTCHA library link also here first we want to make register form with reCAPTCHA code validation so here we have right form tag with attribute method is equal to post and ID is equal to captcha code in this form for enter first name data here we have write input type is equal to text name and ID is equal to first name for display first name text-box validation error here we have right span tag with ID is equal to first name error after this for enter last name data here we have right input type is equal to text name and ID is equal to last name you for display last name text-box validation error here we have right span tag with ID is equal to last name error now for enter email address details here we have write input type is equal to text name and ID is equal to email for display email text box validation error here we have right span tag with ID is equal to email error same way for enter password details here we have right input type is equal to password name and ID attribute is equal to password for display password text box validation error here we have right span tag with ID is equal to password error now here we have create one division tag with class is equal to G reCAPTCHA and data side key attribute is equal to side key which we have get from Google reCAPTCHA ah site here Giri Capshaw class will automatically create reCAPTCHA widget here and site key will verify domain name which we have entered at the time of creating key below this we want to display captcha error so here we have write span tag with ID is equal to captcha error lastly for submit form data here we have write input type is equal to submit name and ID is equal to register and value is equal to register by click on this button form has been submitted with entered data now we have moved to jQuery code for submit form data so here we have write dollar with form ID captcha form with on method and under this we have write submit event so when form has been submitted then this block of code will execute under this first we have write event dot prevent default method it will stop to refresh webpage now we have start right Ajax requests so under this first we have right URL option set to process data dot PHP file it will send request to this file in second option we have right method and here we have defined post method so it will use post method for send data to server in third option we have write data and here we can define which data we want send to server so here we have write dollar this with serialized method it will convert form data into URL encoded string in fourth option we have write data type and here we can define data type in which format we want to receive data from server so here we have write JSON so it will receive data in JSON format in fifth option we have right before send callback function this function has been called before Ajax request has been sent under this function we have write dollar with submit button ID register with attribute method and under this we have write disabled it will disabled submit button lastly we have write success callback function this function has been called if request completed successfully and it will receive data in JSON format under this function we have right dollar with button ID register with attribute method and under this we have disabled property set to false it will enable submit button below this we have right if statement and under condition we have right data dot success if this condition true that means form data successfully validate and it will execute if block of code under this block we have right dollar with form ID captcha form with zero index with reset method it will reset all form field value after this we have right dollar with span tag ID first name error with text method with blank value it will clear first name textbox validation error same way for clear last name textbox validation error so here we have write dollar with span tag ID last name error with text method with blank value now we have write dollar with span tag ID email error with text method with blank value it will clear email textbox validation error after this we have write dollar with span tag ID password error with text method with blank value it will clear password text box validation error for clear CAPTCHA validation error here we have right dollar with span tag ID CAPTCHA error with text method and under this we have write blank value now we want to reset reCAPTCHA so here we have right giri captcha dot reset method it will reset reCAPTCHA and lastly we have rightt alert statement with message like form successfully validated this message will pop up on webpage but suppose there is any form data validation error occur then it will execute else block of code under this block first we have write dollar with span tag ID first name error with text method and under this we have write data dot first name error it will display validation error below first name textbox for display validation error below last name text-box here we have right dollar with span tag ID last name error with text method and under this we have right data dot last name error for display validation error below email text box here we have right dollar with span tag ID email error with text method and under this we have write data dot email error same way for a display validation error below password text box here we have right dollar with span tag ID password error with text method and under this we have right data dot password error lastly for display CAPTCHA a validation error so here we have right dollar with span tag ID CAPTCHA error with text method and under this we have write data dot CAPTCHA error now we have moved to write PHP script so we have go to process data dot PHP file and here we have write if statement and under condition we have write is set function with dollar post first name if this condition true then it will execute if block of code and here first we have create for local variable like dollar first name dollar last name dollar email and dollar password variable is equal to blank value for store form data same way for store validation error so here we have create five variable like dollar first name error last name error email error password error and CAPTCHA error variable is equal to blank value you now we have right if statement and under condition we have right empty function with dollar post first name variable this condition will true if user not enter data in first name textbox and under this block we have right dollar first name error variable is equal to message like first name is required but suppose user has enter first name details so it will execute else block and here we have write dollar first name variable as equal to dollar post first name variable after this we have write if statement and under condition we have write empty function with dollar post last name variable this condition will true if user not enter data in last name textbox and under this block we have write dollar last name error variable is equal to message like last name is required but suppose user has entered lastname details so it will execute else block and here we have right dollar last name variable is equal to dollar post last name variable for validate email data so here we have write if statement and under condition we have write empty function with dollar post email variable this condition will true if user not fill email textbox and under this block we have right dollar email error variable is equal to message like email is required but suppose user has entered lastname details so now we want to check entered email is proper or not so here we have again right if statement under condition we have write not operator with filter VAR function with two arguments like dollar post email variable and in second argument we have right filter validate email you this condition will be true user enter invalid email and here we have right dollar email error variable as equal to message like invalid email but suppose user has entered Aled email so it will execute else block and here we have right dollar email variable as equal to dollar post email variable now we have write if statement and under condition we have write empty function with dollar post password variable this condition will true if user not enter data in password text box and under this block we have right dollar password error variable is equal to message like password is required but suppose user has entered password details so it will execute else block and here we have right dollar password variable as equal to dollar post password variable now we have right if statement and under condition we have right empty function with dollar post G recapture response variable this variable value has been sent by Google reCAPTCHA widget if this variable has blank value that means user has not click on checkbox of Google reCAPTCHA widget and here we have right dollar CAPTCHA error variable is equal to message like CAPTCHA is required but user has solved the CAPTCHA query then it will execute else block of code and here we want to check user successfully solve CAPTCHA query or not for this here we have write dollar secret key variable is equal to secret key which we have get from Google reCAPTCHA website now we have write dollar response variable is equal to file get contents function and under this we have write Google reCAPTCHA API link with site verify variable with question mark secret is equal to dollar secret key variable and response is equal to dollar postgre captcha response variable this code will send requests to Google reCAPTCHA API key with secret key and user CAPTCHA result and it will receive the response regarding user has solved captcha query or not in JSON format after this we have write dollar response data variable as equal to JSON decode function with dollar response variable it will convert JSON data into array format below this we have right if statement and under condition we have right not operator with dollar response data variable with success if this condition true that means user has failed to solve CAPTCHA query and under this block we have right dollar CAPTCHA error variable as equal to message like CAPTCHA verification failed after verify Google reCAPTCHA query now we have write if statement and under condition we have write dollar first-name error variable is equal to blank value and dollar last name error is equal to blank value and dollar email error variable value is equal to blank and dollar password error variable value is equal to blank and dollar CAPTCHA error variable is equal to blank value if this condition true that means all form data validated successfully and there is no any validation error found so here we have right dollar data variable as equal to success key value set to true but suppose there is any validation error found then it will execute else block of code and under this we have right dollar data variable is equal to array first key we have right first name error with value set $2 first name error variable in second key we have right last name error with value set $2 last name error variable in third key we have right email error with value set to dollar email error variable in fourth key we have right password error with value set to dollar password error variable in last key we have right captcha error with value set to dollar CAPTCHA error variable so this way we have store validation error in this dollar data variable now we want to send value of dollar data variable to Ajax requests in JSON format so here we have write echo statement with JSON encode function with dollar data variable so here our code is ready now we have check output in browser friends here we can see when page has been load in to browser then on web page we can see simple form and in form we can see Google reCAPTCHA widget also that means this form has been validate by Google reCAPTCHA widget first we have directory click on register button so on webpage in form we can see validation error below each input fields so first we have fill all input fields except click on Google reCAPTCHA widget you now we have click on register' button so below Google reCAPTCHA widget we can see error message like CAPTCHA is required so we have click on checkbox so on webpage we can see it has asked to click image which relate to this word first we have select wrong image so on webpage we can see it display message like please try again so now we have select proper image after selecting proper image in Google reCAPTCHA widget checkbox has been checked and now we have click on register button after click on register' button it has pop-up message like form successfully validated and after this form data has been cleared and Google reCAPTCHA widget checkbox also removed so this way we can make spam free PHP form by using Google reCAPTCHA and form field validate by Ajax and jQuery if you have any query or input regarding this video tutorial please comment your query or input in comment box or if you like this video tutorial please share with your friends or even you can also share on social media also thanks for watching this video tutorial

Channel: Webslesson

Views: 30,554

Keywords: captcha, Google API, Google reCAPTCHA, PHP, PHP Captcha, recaptcha, recaptcha google, recaptcha php, google recaptcha example, php contact form with recaptcha, add recaptcha to php form, google recaptcha with php, add google recaptcha to php form, add google recaptcha php, php google recaptcha ajax, implement google recaptcha php, integrate google recaptcha, integrate google recaptcha in php

Id: dJB7UBclbEU

Length: 26min 56sec (1616 seconds)

Published: Wed Sep 11 2019