Git Product home page Git Product logo

friendlycaptcha's Introduction

A simple package to help integrate FriendlyCaptcha.

Latest Version on Packagist Total Downloads GitHub Actions

This package helps in setting up and validating FriendlyCaptcha widget and response in your Laravel applications

Installation

You can install the package via composer:

composer require ossycodes/friendlycaptcha

Configuration

Add FRIENDLY_CAPTCHA_SECRET, FRIENDLY_CAPTCHA_SITEKEY and optional FRIENDLY_CAPTCHA_PUZZLE_ENDPOINT, FRIENDLY_CAPTCHA_VERIFY_ENDPOINT in .env file :

FRIENDLY_CAPTCHA_SECRET=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
FRIENDLY_CAPTCHA_SITEKEY=XXXXXXXXXXXXXXXX
FRIENDLY_CAPTCHA_PUZZLE_ENDPOINT=https://api.friendlycaptcha.com/api/v1/puzzle #optional
FRIENDLY_CAPTCHA_VERIFY_ENDPOINT=https://api.friendlycaptcha.com/api/v1/siteverify #optional

You can obtain your site-key from here and secret from here

Usage

For FriendlyCaptcha widget scripts from a CDN, add the Blade directive @friendlyCaptchaRenderWidgetScripts in your layout file. This should be added to the <head> of your document.

<html>
    <head>
        @friendlyCaptchaRenderWidgetScripts()
    </head>
    <body>
        {{ $slot }}
    </body>
</html>

or if you don't want to use the Blade directive you can do this instead

 {!! FriendlyCaptcha::renderWidgetScripts() !!}

You have two options on how to add the script tag either from unpkg (default) or from jsdelivr

@friendlyCaptchaRenderWidgetScripts() or @friendlyCaptchaRenderWidgetScripts('jsdelivr')

{!! FriendlyCaptcha::renderWidgetScripts() !!} or {!! FriendlyCaptcha::renderWidgetScripts('jsdelivr') !!}

You can also host the FriendlyCaptcha widget scripts yourself:

npm install --save [email protected]

And import it in your app:

import "friendly-challenge/widget";

Once that's done, you can call the renderWidget() method in <form> to output the appropriate markup (friendlycaptcha widget) with your site key configured.

<form action="/" method="POST">

    {!! FriendlyCaptcha::renderWidget() !!}

    or with custom theme

    {!! FriendlyCaptcha::renderWidget(['dark-theme' => true]) !!}

    or with custom language

    {!! FriendlyCaptcha::renderWidget(['data-lang' => 'en']) !!}

    <button>
        Submit
    </button>
</form>

Finally On the server, use the provided validation rule to validate the CAPTCHA response.

use Illuminate\Validation\Rule;

public function submit(Request $request)
{
    $request->validate([
        'frc-captcha-solution' => ['required', Rule::friendlycaptcha()],
    ]);
}

If you prefer to not use a macro, you can resolve an instance of the rule from the container via dependency injection or the app() helper.

use Ossycodes\FriendlyCaptcha\Rules\FriendlyCaptcha;

public function submit(Request $request, FriendlyCaptcha $friendlyCaptcha)
{
    $request->validate([
        'frc-captcha-solution' => ['required', $friendlyCaptcha],
    ]);
}
use Ossycodes\FriendlyCaptcha\Rules\FriendlyCaptcha;

public function submit(Request $request)
{
    $request->validate([
        'frc-captcha-solution' => ['required', app(FriendlyCaptcha::class)],
    ]);
}

Testing

composer test

Security

If you discover any security related issues, please email [email protected] instead of using the issue tracker.

Credits

License

The MIT License (MIT). Please see License File for more information.

How do I say Thank you?

Please buy me a cup of coffee https://www.paypal.com/paypalme/osaigbovoemmanuel , Leave a star and follow me on Twitter .

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.