Dans ce tutoriel, nous allons intégrer Stripe à notre application avec un système d'abonnement mensuel et un portail client pour que nos utilisateurs puissent gérer leur abonnement et leur moyen de paiement.
Pour cela il vous faut un compte Stripe et récupérer vos Clés API. Téléchargez le plugin Stripe dans Bubble et renseignez correctement vos champs Clé publique et Clé secrète.
Dans le Dashboard de Stripe, créez un produit avec un montant mensuel / annuel, renseignez la description du produit pour faire afficher le Plan Name plus tard sur Bubble.Sur votre bouton Commander ajoutez un workflow "Subscribe user to a plan" et mettez l'ID du plan que vous avez crée sur Stripe.Ajoutez dans la base de données User ces champs :
- Stripe_Customer_ID (text
- Stripe_Subscription_ID (text)
- Stripe_Subscription_Start (date)
- Stripe_Subscription_End (date)
- Stripe_Subscription_Status (text)
- Stripe_Subscription_Plan_Name (text)
- Stripe_Subscription_Frequency (text)
- Paid_Client (yes/no)
En deuxième étape du Workflow, ajoutez un "Make changes to current user" et remplissez les champs crée ci-dessus avec un "Result of step 1..." sauf pour le Stripe_Customer_ID qui lui sera un "Current user stripe customer's ID".
Ensuite installez le plugin Stripe Customer Portal, renseignez dans le champ API Key comme ceci "Bearer votre_clé_secrète", puis créez un bouton sur votre page Bubble que vous appelerez "Gérer votre abonnement" puis créez un workflow qui sera Stripe customer portal - Stripe portal et dans le paramètre Customer ID, supprimez la valeur par défaut et indiquez "Current User's Stripe_Customer_ID" puis en étape 2 mettez un workflow Open Portal in a New Tab et indiquez en valeur "Result of step 1"(Self Portal..)'s url"
Dans le Dashboard de Stripe, cliquez sur la roue crantée tout en haut à droite, et choisissez Portail Client, ajustez les paramètres comme bon vous semble, et Enregistrer.Voilààà vous avez un super espace pour que vos clients puissent gérer leur abonnement mensuel
Partage cette vidéo sur