...
✅ WEB- ja WordPress -uutiset, -teemat, -laajennukset. Täällä jaamme vinkkejä ja parhaita verkkosivustoratkaisuja.

Kuinka lisätään, en ole robotti captcha Laravel Formsissa

56

Haluatko lisätä Google reCAPTCHA: n Laravel-lomakkeisiin? Google reCAPTCHA auttaa suojaamaan lomakkeita botteilta, joiden seurauksena pelastamme meidät roskapostilta. Jos et suojaa lomakkeitasi, luultavasti saat paljon roskapostia tietokantaan.

Kirjoitushetkellä Google tarjoaa reCAPTCHA: sta kaksi versiota – v2 ja v3. ReCAPTCHA v3 sijoittaa kuvakkeen sivuidesi oikeaan alakulmaan ja he vahvistavat pyynnöt pisteillä. Toisaalta reCAPTCHA v2 tarkistaa pyynnöt haasteen avulla. Tässä artikkelissa tutkimme reCAPTCHA v2: n ja vahvistamme pyynnöt "En ole robotti" -valintaruudulla.

Miksi Google reCAPTCHA tarvitaan?

Internet-botti on järjestelmä, joka suorittaa automaattisia komentosarjoja Internetissä. He kohdistavat verkkosivustolomakkeet lähettämään roskapostia tietokantaan. Pohjimmiltaan tämä järjestelmä toimii paljon nopeammin kuin ihmiset yksin. Haluamme aina, että oikea ihminen on vuorovaikutuksessa verkkosivustollemme, ei botti.

Lisäämällä Google reCAPTCHA -palvelun voimme suojata verkkosivustolomakettamme näitä Internet-botteja, niiden roskapostia ja väärinkäytöksiä vastaan. Automaattisen järjestelmän on mahdotonta ratkaista reCAPTCHA: n asettamaa haastetta. Lomakettasi ei lähetetä ennen kuin haaste on ratkaistu. Ihminen voi helposti ratkaista nämä haasteet ja lähettää lomakkeen.

Määritä Google reCAPTCHA Laravel-verkkosivustollesi

Aloittaaksesi sinun on ensin rekisteröitävä sivusto Googlessa. Valitse vaihtoehto reCAPTCHA v2 ja "En ole robotti" -valintaruutu, kuten alla olevassa kuvakaappauksessa näytetään.

Kuinka lisätään, en ole robotti captcha Laravel Formsissa

Kun rekisteröit sivuston, kopioi sivuston avain ja salainen avain, joita tarvitsemme hetken kuluttua.

Meidän on lisättävä reCAPTCHA Laravel-projektiin. Tehtävän suorittamiseen aion käyttää anhskohbo / no-captcha- kirjastoa.

Avaa komentokehote projektisi juurihakemistossa ja suorita komento:

composer require anhskohbo/no-captcha

Avaa tiedosto config / app.php ja lisää alla oleva rivi tarjoajien ryhmään.

AnhskohboNoCaptchaNoCaptchaServiceProvider::class,

Lisää luokan alias aliaksiryhmään:

'NoCaptcha' => AnhskohboNoCaptchaFacadesNoCaptcha::class,

Julkaise määritystiedosto komennolla:

php artisan vendor:publish --provider="AnhskohboNoCaptchaNoCaptchaServiceProvider"

Seuraavaksi avaa .envtiedosto ja määritä reCAPTCHA-avaimet seuraavasti.

NOCAPTCHA_SECRET=secret-key
NOCAPTCHA_SITEKEY=site-key

Muista korvata paikkamerkkien salainen avain ja sivustoavain todellisilla arvoilla.

Tyhjennä määritysvälimuisti suorittamalla alla oleva komento.

php artisan config:clear 

Google reCAPTCHA: n lisääminen Laravelin lomakkeeseen

Tässä vaiheessa olet suorittanut reCAPTCHA: n edellyttämät perusasetukset. Kirjoita nyt koodi ja tee se toiminnassa.

Avaa näkymätiedosto, johon haluat lisätä En ole robotti -valintaruutu. Alusta terätiedoston yläosassa JS-lähde seuraavasti:

{!! NoCaptcha::renderJs() !!}

Lisää alla oleva yksirivinen käsky kohtaan, jossa haluat näyttää reCAPTCHA-valintaruudun. Paras paikka on ennen Lähetä-painiketta.

{!! NoCaptcha::display() !!}

Luodaan esimerkkinä lomake, jossa on vähän kenttiä, ja lisätään siihen reCAPTCHA käyttämällä alla olevaa koodia.

{!! NoCaptcha::renderJs() !!}
 
@if ($errors->has('g-recaptcha-response'))
    <span class="help-block">
        <strong>{{ $errors->first('g-recaptcha-response') }}</strong>
    </span>
@endif
<form action="{{ url('ROUTE_HERE') }}" method="post">
    <p>Name: <input type="text" name="fullname" /></p>
    <p>Email: <input type="email" name="email" /></p>
    <p>Message: <textarea name="message"></textarea></p>
    {!! NoCaptcha::display() !!}
    {{ csrf_field() }}
    <p><input type="submit" name="submit" value="Submit" /></p>
</form>

Kun olet lisännyt yllä olevat rivit, näet reCAPTCHA: n näyttävän jotain, kuten alla olevassa kuvakaappauksessa.

Kuinka lisätään, en ole robotti captcha Laravel Formsissa

Lisäsin yllä olevaan koodiin myös koodin, joka näyttää virheen, jos se tapahtuu reCAPTCHA: n vahvistamisen yhteydessä.

Nyt meidän on vahvistettava reCAPTCHA lomakkeen lähettämisessä. Tämän saavuttamiseksi käytän Laravel Validatoria seuraavasti.

<?php
 
namespace AppHttpControllers;
 
use IlluminateHttpRequest;
use IlluminateSupportFacadesValidator;
 
class ContactController extends Controller
{
    ...
    ...
    public function store(Request $request)
    {
        $messages = [
            'g-recaptcha-response.required' => 'You must check the reCAPTCHA.',
            'g-recaptcha-response.captcha' => 'Captcha error! try again later or contact site admin.',
        ];
 
        $validator = Validator::make($request->all(), [
            'g-recaptcha-response' => 'required|captcha'
        ], $messages);
 
        if ($validator->fails()) {
            return redirect('ROUTE_HERE')
                        ->withErrors($validator)
                        ->withInput();
        }
 
        // process the form
    }   
}

Tässä olen sisällyttänyt julkisivun "Validator" ja vahvistanut reCAPTCHA: n "store" -menetelmään. Jos vahvistus epäonnistuu, se heittää virheen.

Se siitä! Olet lisännyt reCAPTCHA v2 -sovelluksen onnistuneesti, koska en ole robotti -valintaruutu Laravel-lomakkeeseen. Lomakettasi ei lähetetä ennen kuin kävijä on ratkaissut reCAPTCHA-haasteen.

Aiheeseen liittyvät artikkelit

Tämä verkkosivusto käyttää evästeitä parantaakseen käyttökokemustasi. Oletamme, että olet kunnossa, mutta voit halutessasi kieltäytyä. Hyväksyä Lisätietoja