LatePoint Addon – Payments Flutterwave

Intégration de Flutterwave avec LatePoint : Un Guide Complet

L’intégration d’un processeur de paiement comme Flutterwave dans votre système LatePoint peut sembler intimidante, mais en suivant les étapes clés, vous pouvez faciliter le processus de réservation pour vos clients et améliorer la gestion de vos paiements. Ce guide va vous conduire à travers chaque étape de la configuration, de l’enregistrement des informations de votre processeur de paiement jusqu’à la gestion des paiements.

Configuration du Plugin LatePoint pour Flutterwave

Étape 1 : Téléchargement et préconfiguration

Pour commencer, téléchargez l’addon de démarrage du LatePoint. Une fois téléchargé, décompressez-le et renommez le dossier en latepoint-payments-flutterwave. Assurez-vous de remplacer toutes les instances de -addon-starter par -payments-flutterwave. Ensuite, ouvrez le fichier principal que vous avez renommé en latepoint-payments-flutterwave.php et modifiez toutes les variables et chaînes de caractères de addon-starter à payments-flutterwave.

Il est crucial de renommer également l’objet principal $LATEPOINT_ADDON_ADDON_STATER à la dernière ligne du fichier pour éviter toute confusion.

Étape 2 : Enregistrement de Flutterwave comme Méthode de Paiement

Pour réussir l’intégration, vous aurez besoin des clés API publiques et secrètes que le propriétaire de l’entreprise peut générer dans les paramètres de Flutterwave. Ensuite, vous devez préparer une interface dans LatePoint pour capturer ces clés dans les paramètres de votre système.

Voici un exemple de code de base pour créer une nouvelle méthode de paiement dans LatePoint :

“`php
class LatePointPaymentsFlutterwave {
public $version = ‘1.0.0’;
public $db_version = ‘1.0.0’;
public $addon_name = ‘latepoint-payments-flutterwave’;
public $processor_code = ‘flutterwave’;

public function init_hooks() {
    add_filter('latepoint_payment_processors', [$this, 'register_payment_processor'], 10, 2);
    add_filter('latepoint_all_payment_methods', [$this, 'register_payment_methods']);
    add_filter('latepoint_enabled_payment_methods', [$this, 'register_enabled_payment_methods']);
}

// Fonctions pour l'enregistrement

}
“`

Ce code établit l’enregistrement de Flutterwave comme méthode de paiement et enregistre les méthodes de paiement disponibles. Il est essentiel de toujours garder votre code organisé pour faciliter les modifications et les mises à jour futures.

Établissement des Méthodes de Paiement

Création des Méthodes de Paiement

Vous devez définir les méthodes de paiement que vous souhaitez activer. Pour Flutterwave, nous allons utiliser inline_checkout :

php
public function get_supported_payment_methods() {
return [
'inline_checkout' => [
'name' => __('Inline Checkout', 'latepoint-payments-flutterwave'),
'label' => __('Inline Checkout', 'latepoint-payments-flutterwave'),
'image_url' => LATEPOINT_IMAGES_URL . 'payment_cards.png',
'code' => 'inline_checkout',
'time_type' => 'now'
]
];
}

Traitement des Hooks

La mise en œuvre des hooks est nécessaire pour relier votre code aux différentes parties du système LatePoint. Créez des fonctions pour chacune des tâches que vous avez définies ci-dessus.

“`php
public function register_payment_processor($payment_processors, $enabled_only) {
$payment_processors[$this->processor_code] = [
‘code’ => $this->processor_code,
‘name’ => __(‘Flutterwave’, ‘latepoint-payments-flutterwave’),
‘image_url’ => $this->images_url() . ‘processor-logo.png’
];
return $payment_processors;
}

public function register_payment_methods($payment_methods) {
return array_merge($payment_methods, $this->get_supported_payment_methods());
}

public function register_enabled_payment_methods($enabled_payment_methods) {
if (OsPaymentsHelper::is_payment_processor_enabled($this->processor_code)) {
$enabled_payment_methods = array_merge($enabled_payment_methods, $this->get_supported_payment_methods());
}
return $enabled_payment_methods;
}
“`

Configuration des Clés API et Autres Paramètres

Création d’un Formulaire de Paramètres

Pour capturer les clés API et d’autres paramètres nécessaires, vous devez créer un formulaire dans l’interface de gestion de LatePoint. Utilisez les helpers de form pour créer des champs pour la clé publique, la clé secrète et d’autres détails comme le code pays et la devise :

php
public function add_settings_fields($processor_code) {
if ($processor_code != $this->processor_code) return false;
?>
<h3><?php _e('API Keys', 'latepoint-payments-flutterwave'); ?></h3>
<?php echo OsFormHelper::text_field('settings[flutterwave_publishable_key]', __('Public Key', 'latepoint-payments-flutterwave'), OsSettingsHelper::get_settings_value('flutterwave_publishable_key')); ?>
<?php echo OsFormHelper::password_field('settings[flutterwave_secret_key]', __('Secret Key', 'latepoint-payments-flutterwave'), OsSettingsHelper::get_settings_value('flutterwave_secret_key')); ?>
<h3><?php _e('Other Settings', 'latepoint-payments-flutterwave'); ?></h3>
<?php echo OsFormHelper::select_field('settings[flutterwave_country_code]', __('Country', 'latepoint-payments-flutterwave'), OsPaymentsFlutterwaveHelper::load_countries_list(), OsSettingsHelper::get_settings_value('flutterwave_country_code', 'NG')); ?>
<?php echo OsFormHelper::select_field('settings[flutterwave_currency_iso_code]', __('Currency Code', 'latepoint-payments-flutterwave'), OsPaymentsFlutterwaveHelper::load_currencies_list(), OsSettingsHelper::get_settings_value('flutterwave_currency_iso_code', 'NGN')); ?>
<?php echo OsFormHelper::media_uploader_field('settings[flutterwave_logo_image_id]', 0, __('Logo for Payment Modal', 'latepoint-payments-flutterwave'), __('Remove Logo', 'latepoint-payments-flutterwave'), OsSettingsHelper::get_settings_value('flutterwave_logo_image_id')); ?>
<?php
}

En utilisant ce code, vous garantissez que toutes les informations nécessaires sont correctement capturées avant que le paiement ne soit traité.

Sécurisation des Clés

Il est recommandé de chiffrer les clés secrètes pour des raisons de sécurité. Utilisez le hook latepoint_encrypted_settings pour inclure votre clé secrète dans une liste de valeurs à chiffrer.

“`php
public function init_hooks() {
add_filter(‘latepoint_encrypted_settings’, [$this, ‘add_encrypted_settings’]);
}

public function add_encrypted_settings($encrypted_settings) {
$encrypted_settings[] = ‘flutterwave_secret_key’;
return $encrypted_settings;
}
“`

Gestion des Paiements avec Flutterwave

Passation des Données vers le Frontend

Ensuite, vous devez passer les informations de configuration à votre JavaScript front-end. Ceci est fait via le filtre latepoint_localized_vars_front, qui ajoute les variables nécessaires pour que votre frontend puisse accéder aux paramètres du processeur de paiement.

php
public function localized_vars_for_front($localized_vars) {
if (OsPaymentsHelper::is_payment_processor_enabled($this->processor_code)) {
$localized_vars['is_flutterwave_active'] = true;
$localized_vars['flutterwave_key'] = OsSettingsHelper::get_settings_value('flutterwave_publishable_key', '');
$localized_vars['flutterwave_payment_options_route'] = OsRouterHelper::build_route_name('payments_flutterwave', 'get_payment_options');
} else {
$localized_vars['is_flutterwave_active'] = false;
}
return $localized_vars;
}

Chargement des Scripts et Styles

Une fois passées, vos données doivent être utilisées dans le JavaScript pour initier la session de paiement. Vous devez vous assurer que les scripts et styles CSS sont correctement chargés :

php
public function load_front_scripts_and_styles() {
wp_enqueue_style('latepoint-payments-flutterwave-front', $this->public_stylesheets() . 'latepoint-payments-flutterwave-front.css', false, $this->version);
wp_enqueue_script('flutterwave-checkout', 'https://checkout.flutterwave.com/v3.js', false, null);
wp_enqueue_script('latepoint-payments-flutterwave-front', $this->public_javascripts() . 'latepoint-payments-flutterwave-front.js', ['jquery', 'flutterwave-checkout', 'latepoint-main-front'], $this->version);
}

Écriture du JavaScript pour le Traitement des Paiements

Dans le fichier latepoint-payments-flutterwave-front.js, vous allez définir comment gérer les événements de paiement et interagir avec l’API Flutterwave.

“`javascript
class LatepointPaymentsFlutterwaveAddon {
constructor(){
this.ready();
}
ready(){
jQuery(document).ready(() => {
jQuery(‘body’).on(‘latepoint:submitBookingForm’, ‘.latepoint-booking-form-element’, (e, data) => {
if(!latepoint_helper.demo_mode && data.is_final_submit && data.direction === ‘next’){
let payment_method = jQuery(e.currentTarget).find(‘input[name=”booking[payment_method]”]’).val();
switch(payment_method){
case ‘inline_checkout’:
latepoint_add_action(data.callbacks_list, () => {
return this.initPaymentModal(jQuery(e.currentTarget), payment_method);
});
break;
}
}
});
});
}

initPaymentModal($booking_form_element, payment_method) {
    // Logic for initializing the payment modal goes here
}

}
let latepointPaymentsFlutterwaveAddon = new LatepointPaymentsFlutterwaveAddon();
“`

Gestion des Réponses de Paiement

Après la soumission et le succès du paiement, il est important d’enregistrer les transactions dans la base de données. Vous devrez vous connecter à l’API Flutterwave pour vérifier que la transaction a été retournée comme réussie.

php
public function process_payment($result, $booking, $customer) {
if (OsPaymentsHelper::is_payment_processor_enabled($this->processor_code)) {
switch($booking->payment_method) {
case 'inline_checkout':
if($booking->payment_token) {
$remote = wp_remote_get( "https://api.flutterwave.com/v3/transactions/".$booking->payment_token."/verify", [
'timeout' => 10,
'headers' => [
'Accept' => 'application/json',
'Authorization' => 'Bearer '. self::get_secret_key()
]
]);
if (!is_wp_error($remote) && isset($remote['response']['code']) && $remote['response']['code'] == 200 && !empty($remote['body'])) {
// Processing response here
} else {
// Handle API connection errors
}
} else {
// Handle missing payment token error
}
break;
}
}
return $result;
}

La mise en place d’un bon système de vérification des paiements est essentielle pour le bon fonctionnement de votre entreprise. Cela permet non seulement de s’assurer que les transactions sont sécurisées, mais aussi de garantir que vos clients ne rencontrent pas de problèmes lors de leurs réservations.

En résumé, intégrer le processeur de paiement Flutterwave avec LatePoint vous offre une solution efficace pour gérer les paiements en ligne. En suivant ces étapes, vous équipée votre entreprise d’un outil robuste et sécurisé, facilitant ainsi la gestion des transactions et améliorant l’expérience client. Vous avez désormais un aperçu détaillé de chaque étape à suivre, de l’enregistrement du processeur de paiement à la gestion des transactions, tout en prêtant attention à la sécurité et à l’expérience utilisateur.