How to create, integrate reCAPTCHA and verify it using google api in PHP | PHP reCAPTCHA Checkbox

hey guys welcome back so guys in this video we are going to learn how to add a Google recapture in our contact form okay so guys those who have not seen how to create a contact form and send a mail using PHP mailer so please watch out this video link given in the description okay so this is the video about how to send a mail using PHP mailer via contact form okay so now guys let's get back and we want to add a recapture before this button okay so guys let's get started to build the recapture so first step guys you have to search for Google recapture here guys you see this link that recapture Google here let me click on it and you are on this recapture about okay so now let's click on this V3 admin console so if you click on it it will take you to a list of recapture you have created or you're are going to create so now guys let's click on this plus so it will create create a new recapture so now you can register new site for the recapture and here is a label guys Fonda my YT okay so this will be my label so let me just note it somewhere else so here I note this is the label LEL label okay and now guys let's move below and coming to this recapture type here you have to select with the challenge V2 and on this V2 you have to select I'm not a robot that is checkbox okay just select this and then guys you have to give your domain name so right now we are working on the Local Host so you can directly provide the Local Host itself okay so you don't have to give this any URL type just enter that Local Host it will validate so if you're using a live website for example like I'll just show you funoff it.com if you want to use this just enter the domain name okay so you have to give just in this way so right now we are not using any domain so we have to test on the Local Host so I'll be entering the Local Host okay yep and now guys here it selects the project name so if you want you can select any or else you can just create your new project okay so let me tell here like YouTube tutorial okay funa that's it and now you can just click on submit so let's click on submit here perfect so here we are still setting up the recapture once it is done it will show you but you can copy your uh site key and secret key okay so let us copy this and paste inside our notepad so here we paste like site key and secret key so let's copy this and paste inside our notepad secret key okay let us just wait until it gets created perfect so here you see guys success you all set up now we can use this and here you see that you can go to the setting option go to analytics so if you want to go to settings you'll go to settings and change your data like you want to change the label name or anything so now I will go back and you can manage all the sites here so right now what I have created is fundam my YT okay that is YouTube so guys we have successfully created the um recapture code that is site key and secret key so we have created it and now guys let's get back and get started to integrate so first step guys let me just search for the recapture doc so here I search for recapture documentation and here is the intro part guys okay so now let's click on it okay and let's see with the recapture version two so here is a check box guys just click on it and you should find that script okay so here it says that you have to include this script okay so let's copy this CDN link and go to your contact.php form and inside the head tag you have to paste it okay so I have pasted now all set now let's get back to the browser and here you see in the form you are using a simple div here which is going to be your recapture part so now let's copy this contrl C get back to your editor and here is my form and inside this form I have a button so before this button I'll be pasting the recapture okay so here is my recapture code and inside this uh attribute like data site key you have to paste your site key so guys we have already copied that and pasted in your notepad so let me just copy this and paste here okay all set and now guys you can get back and yep let's move on your Local Host refresh and here you see that I'm not a robot part has come perfect so our integration of recapture is done okay so now let's click on it I'm not a robot and check and then guys once you submit it should verify the token also okay that I'm not a robot so for that also you have to just go through this documentation and here is that verify the user response on this user response you can find using the API so guys let me just show you one more thing I just want to disable this button before I'm not a robot tick okay so let me refresh and here it should not be able to click it should be disabled once you check then only it should be enabled so it's a very simple step guys you can just follow this get back to your editor and below this script itself I'll just add a new script tag and here create a simple function function and the function name like enable submit button okay open and close function and now insert this uh with the help of JavaScript document. getet element element by ID function dot disable disa equal to false and in this get element by ID is my uh submit button okay so now you can copy this and create a ID inside your button so this is my button tag I just want to create a simple ID here equal to and paste that code okay so how many buttons you are creating you just create a new function and use in this way so now guys you have to call this function inside your recapture code so here inser this recapture div so after this data site key just use data hyphen call back and inside this you paste your function name that's it so not required to use that double I mean open and close bracket directly you can use that okay so it will call this function copy this and paste here that's it and now guys here you have to directly disabled equal to disable let me just copy this and paste here okay by default it should be disabled when you check the recapture then it should be enabled with this help of ID okay so now you can get back and refresh so here you see whatever you click on this send mail it's disabled once you check the checkbox it is enabled okay so perfect so now guys let's get back on the checkbox verification so recapture verification so for that you have to click on this verify the user response let's click on it and here you see the API request okay so here is the API guys which is using the post method and these are the post parameters use which is secret and the response so now guys let us integrate this to verify in our code so now guys let's get back and once you click on this submit button it goes to the action which is going inside the send mail okay so this button is clicked on that button click it is going to send mail let me go to the send mail and here guys this is the button click come here after all taking all the inputs I want to check so use a if condition open and close calibra use a is set method dollor poost off single codes so now let me just show you what we have to copy and paste go to your documentation and you'll be finding a Google response okay so here is a post parameter when the user submits the form on your site so let's copy this so which we are getting in a post request and also we have to check it is empty or not so let me copy this use and operator and and not empty function and just spacee that if it is correct then it will come in else else you should say like redirect back so the sending mail code is here so for that let me just control X this complete else part and move the code inside your if condition yep and here is my else condition okay and in this else condition paste this header location and exit so going to back so you should go back okay so let me just show you what is the code for going back and showing the message let's copy this and paste here so we have already done the session I mean message handling so here you paste like like uh error in recapture verification okay so now guys let us go top and let me minimize this try catch okay so if it has data then you have to verify so first let me copy the secret key equal to inside double codes you paste it or use single codes and paste it okay yep let me go to my notepad copy this secret your secret code and paste here and now let's create one verify response equal to file get contents function and inside this you have to give the URL complete URL okay so what is the URL guys let me just show you so here is the API request so you just need to copy to site verify okay now copy and paste insert single codes here done and now guys as a parameter you have to pass two things that is your secret and response so let us copy the secret get back give question mark secret equal to and now you have to concatenate your secret key so let me just copy this and yeah yep give Dot and paste Here and Now guys after this you have to paste the response also so again dot single codes and copy this response paste it using and symbol and then paste the response okay equal to single codes and concatenate the response guys okay so what will be your response this is your response Okay Google recapture response let's copy and paste here directly that's it so what we'll be getting in this response the response is something like this here the response in the JS object so if you want to get that in PHP then you have to jsn decode okay so let me create a response variable equal to JS oore decode function and inside this you paste this variable okay your verifier response after decoding that you can just use as a object so if response of success okay so why is this success because here in the response you are getting this so you'll be getting true or false okay so basically we are checking with the true if success is true then send the mail else show that something went wrong while verifying okay so now you can copy this and paste the else condition paste here so recapture verification API colon something went wrong okay so now let's save and you're done so guys this was all about the recapture verification and integration part so now let us test whether it works or not so let us refresh once again so let's fill the data so here is my email let's enter with so with at gmail.com subject recapture testing copy and paste and let's click on it I'm not a robot send mail perfect so guys you see that thank you you thank you contacting us okay now you'll be getting the mail cool so guys you have verified the recapture and then you have got the email okay so guys in this video that's it thank you for watching this video and please subscribe like and share

Channel: Funda Of Web IT

Views: 631

Keywords: fundaofwebit, how to create recaptcha in php, how to integrate recaptcha checkbox in php, google recaptcha integration in php html, integrate google recaptcha checkbox in php, recaptcha verify in php, send mail via contact form with gooele recaptcha in php tutorial, recaptcha tutorial in php step by step, google recaptcha v2, google recaptcha v2 integration in php, how to create and integrate recaptcha and verify recaptcha using google api in php

Id: HTAYsS_BsYA

Length: 14min 45sec (885 seconds)

Published: Sun Jun 02 2024