Hvordan legge inn ReCaptcha på nettside som bruker PHP.
Se demo her: https://gudjon.kattahub.no/dennefilen.php br> br>
Du må registrere ditt domene og få en API-nøkkel fra google for å bruke reCAPTCHA.
Dette gjør du her: https://www.google.com/recaptcha/admin
I dette eksemplet, så skal jeg lage for subdomenet gudjon.kattahub.no og ikke for hele kattahub.no
Jeg legger derfor inn gudjon.kattahub.no som domene.
Jeg velger v2 og «I’m not a robot»
Når siden er registrert, så kan du hente ut nøklene som du så bruker på nettsiden og i koden.
Jeg har alt i samme fil, som jeg kaller for dennefilen.php
Du må inkludere javaskritet som snakker med Google-api i header. Se linje 3
<html> <head> <script src='https://www.google.com/recaptcha/api.js' async defer ></script> </head> <body>
Legg merke til at linjene 2 til 4 er samme div. Det er kun satt opp på flere linjer for bedre oversikt. Det er denne som viser boksen «I’m not a robot.
<form action="dennefilen.php" method="POST"> <div class="g-recaptcha" data-sitekey="6LejBoUdAAhjkcfdshfsdSpe" data-callback="callback"></div> <br /> <button id="submit-button" type="submit">Submit</button> </form>
if(!empty($_POST['g-recaptcha-response'])) // Start - sjekker om det var haket av for g-recaptcha { $secret = '6LejBoUdAAAAAvcxzvxxxxczsmo7'; // SECRET KEY fra google $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) { // Hvis alt er OK, så kan vi sende kontaktskjema, eller jobbe mot databasen. // Jeg velger her bare å legge melding i variabel, som jeg så skriver ut med echo på netsiden $message = "ALT OK og vi kan gå videre"; } else { $message = "Kunne ikke verifisere - var site-key og sectret key riktig?"; } echo $message; } // slutt
Det kan være hendig å deaktivere submit-knappen frem til det er haket av for «I’m not a robot» br>
Dette gjør vi med callback-funksjon i javascript. br>
Det første vi må gjøre, er å legge til disabled i taggen for knappen.
Vi må også ha id på knappen – hos meg ser den slik ut: id=»submit-button» – denne bruker jeg så i selve javascriptet.
<button id="submit-button" type="submit" disabled> Submit </button>
Deretter legger vi inn følgende kode helt nederst i filen, før vi avslutter body-taggen.
<script type="text/javascript"> function callback() { const submitButton = document.getElementById("submit-button"); submitButton.removeAttribute("disabled"); } </script> </body>
Se demo her: https://gudjon.kattahub.no/dennefilen.php