Intégration de l’api monetbil sur laravel

Nous allons commencer par télécharger l’api en cliquant sur ce lien si monetbil.

Etape 1- Création du projet Laravel

Après avoir téléchargé créez votre projet laravel tapez la commande :

 composer create-project --prefer-dist laravel/laravel monetBilIntegration

Etape 2- Intégration de l’API

Une fois le projet créé, allez dans le répertoire config/services.php qui se trouve à la racine de votre projet laravel et ajoutez ceci :

'monetbil' => [
         'key' => env('MONETBIL_KEY'),
         'secret' => env('MONETBIL_SECRET'),
         'version' => env('MONETBIL_VERSION'),
     ],

Ensuite ouvrez votre .env et ajoutez ceci :

MONETBIL_KEY=YOUR_MONETBIL_KEY
MONETBIL_SECRET=YOUR_MONETBIL_SECRET_KEY
MONETBIL_VERSION=YOUR_MONETBIL_VERSION (v2.1)

NB : Copiez les clé (YOUR_MONETBIL_KEY & YOUR_MONETBIL_SECRET_KEY) dans votre compte monetbil

Etape 3- Création de la Façade personnalisé Monetbil

Créez un dossier Monetbil dans le dossier app. A l’intérieur de ce répertoire créez un fichier nommé Monetbil.php.
Ensuite copiez le contenu du fichier monetbil.php qui se trouve dans le dossier de monetbil que vous avez téléchargé.

Nous allons personnaliser cette classe. Cette classe sera considéré comme une façade donc elle devra étendre la classe Facade de laravel. Modifiez l’entête du fichier comme ceci :

<?php 

namespace App\Monetbil;

use Illuminate\Support\Facades\Facade;

define('__MONETBIL__', true);

abstract class Monetbil extends Facade

A la fin du fichier Monetbil.php, modifiez la ligne :

require_once 'config.php';

par :

// Exit if accessed directly
if (!defined('__MONETBIL__')) {
    exit;
}

// To get your service key and secret, go to -> https://www.monetbil.com/services

Monetbil::setServiceKey(config('services.monetbil.key'));
Monetbil::setServiceSecret(config('services.monetbil.secret'));

// To use responsive widget, set version to 'v2.1'
Monetbil::setWidgetVersion(config('services.monetbil.version'));

Etape 4- Ajout des librairies css et js

Ajoutez les fichier css et js. Copiez le répertoire assets se trouvant dans le dossier monetbill que vous avez téléchargé.
Créez un répertoire nommé « monetbill » dans le dossier « public » de votre projet et collez le dossier assets à l’intérieur

Etape 5 – Personnalisation de la fonction js()

Ensuite ouvrez la façade Monetbil.php allez au niveau de la méthode js() et remplacez là par ceci :

 public static function js($autoopen = false)
 {
         $auto = $autoopen ? '-auto' : '';    
         if (self::MONETBIL_WIDGET_VERSION_V2 == self::getWidgetVersion()) {
             $js = '<script type="text/javascript" src="monetbil/assets/js/monetbil' . $auto . '.min.js?t=' . time() . '"></script>';
         } else {
             $js = '<script type="text/javascript" src="monetbil/assets/js/monetbil-mobile-payments' . $auto . '.js?t=' . time() . '"></script>';
         }
    return $js;
}
  

Etape 6 – Création du service provider

Tapez la commande :

 php artisan make:provider 'MonetbilServiceProvider'

A l’intérieur du provider (App\Providers\MonetbilServiceProvider) au niveau de la fonction « register() » ajoutez ceci:

public function register()
{
         $this->app->bind('MonetBil', function () {
             return new MonetBil;
         });
}

N’oubliez pas d’importer la classe Monetbill comme ceci :

 use App\MonetBil\MonetBil;

Etape 7 – Enregistrement du provider
Allez dans le répertoire config situé à la racine de votre projet et ajoutez ceci dans le fichier « app.php » au niveau des providers

'providers' => [
        ...
        App\Providers\MonetbilServiceProvider::class,
],

Au niveau des « aliases » ajoutez ceci :

'aliases' => [
       ...
      'MonetBil' => App\Monetbil\Monetbil::class,
],

Ensuite tapez la commande

 composer dump-autoload

Etape 8 – Configuration du controlleur

Copiez le code ci-dessus dans le controlleur

public function index()
    {
    	// Setup Monetbil arguments
		Monetbil::setAmount(1);
		Monetbil::setCurrency('XAF');
		Monetbil::setLocale('en'); // Display language fr or en
		Monetbil::setPhone('');
		Monetbil::setCountry('');
		Monetbil::setItem_ref('2536');
		Monetbil::setPayment_ref('d4be3535f9cb5a7aff1f84fa94e6f040');
		Monetbil::setUser(12);
		Monetbil::setFirst_name('KAMDEM');
		Monetbil::setLast_name('Jean');
		Monetbil::setEmail('jean.kamdem@email.com');
		Monetbil::setLogo('https://storage.googleapis.com/cdn.ucraft.me/userFiles/ukuthulamovies/images/937-your-logo.png');

		//configurez la route qui sera appelé une fois que le paiement sera effectué
		Monetbil::setReturn_url('/monetbil/success');
		Monetbil::setNotify_url('/monetbil/ipn');

		$MONETBIL_WIDGET_VERSION_V2 = Monetbil::MONETBIL_WIDGET_VERSION_V2;
		$widgetVersion = Monetbil::getWidgetVersion();

		$payment_url = Monetbil::url();
		$monetbilJS = Monetbil::js();

		return view('welcome', compact('payment_url', 'MONETBIL_WIDGET_VERSION_V2', 'widgetVersion', 'monetbilJS'));
    }
  

Etape 9 – Configuration de la vue
Ici nous allons insérer le bouton de paiement de monetbil
Copiez le code ci dessous :

<style type="text/css">
    .btnmnb {
        background: #3498db;
        background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
        background-image: -moz-linear-gradient(top, #3498db, #2980b9);
        background-image: -ms-linear-gradient(top, #3498db, #2980b9);
        background-image: -o-linear-gradient(top, #3498db, #2980b9);
        background-image: linear-gradient(to bottom, #3498db, #2980b9);
        font-family: Arial;
        color: #ffffff;
        font-size: 20px;
        padding: 10px 20px 10px 20px;
        text-decoration: none;
        cursor: pointer;
    }

    .btnmnb:hover {
        background: #3cb0fd;
        background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
        background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
        background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
        background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
        background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
        text-decoration: none;
    }
</style>

@if ($MONETBIL_WIDGET_VERSION_V2 == $widgetVersion)
    <form action="{{$payment_url}}" method="post" data-monetbil="form">
        <button type="submit" class="btnmnb" id="monetbil-payment-widget">Pay By Mobile Money</button>
    </form>
@else
    <a class="btnmnb" href="{{$payment_url}}" id="monetbil-payment-widget">Pay By Mobile Money</a>
@endif

<!-- To open widget, add JS files -->
<?php echo $monetbilJS; ?>

On obtient ceci dans la vue

Une fois que vous aurez cliqué sur le bouton « Pay by Mobile Money

lien du dépôt github intégration de monetbil sur laravel

Related posts

Leave a Comment