Créer une solution d’abonnement pour une startup IA avec un modèle de tarification basée sur l’utilisation.

Avant d’intégrer Stripe, vous devez créer un compte Stripe.

1. Créez un compte en saisissant votre adresse e-mail, votre nom complet, votre pays et en créant un mot de passe.
2. Renseignez le profil de votre entreprise.
3. Dans le Dashboard, cliquez sur Vérifier votre e-mail. Un e-mail de vérification est envoyé à votre adresse e-mail.
4. Vérifiez votre adresse e-mail.

avant de traiter des transactions réelles, testez votre intégration à l’aide des outils de test de Stripe, notamment les environnements de test et les horloges de simulation. configurez-les dès le départ pour pouvoir itérer et ajuster votre intégration avant la mise en production.

Créer un environnement de test

Commencez par créer un environnement de test. Configurez l’environnement de test pour qu’il corresponde à votre configuration en mode actif, afin de pouvoir tester et valider en continu vos changements.

Créer une horloge de test

Ensuite, créez une horloge de test pour simuler l’avancement du temps dans l’environnement de test. À mesure que vous faites avancer l’horloge de test, des ressources telles que les abonnements changent d’état et déclenchent des webhooks.

1. dans le dashboard Stripe, accédez à la page des horloges de test dans le dashboard.
2. Cliquez sur + Nouvelle simulation.
3. Dans la fenêtre modale Créer une nouvelle simulation, saisissez un nom pour la simulation. Vous pouvez l’utiliser pour décrire le scénario testé, comme Annual renewal ou Free trial.
4. Définissez l’heure figée de l’horloge. Il s’agit du point de départ de votre simulation. Vous pouvez la définir dans le futur ou dans le passé, mais vous ne pouvez la faire avancer que dans le temps après l’avoir fixée.

Pour simuler des scénarios d’abonnement, cliquez sur le menu déroulant Ajouter et sélectionnez Client. Vous devez uniquement saisir un nom pour le client, mais pour certains scénarios (par exemple, le calcul et la collecte de taxes), vous devez ajouter d’autres informations, comme les adresses de facturation et de livraison.

Ensuite, cliquez sur le menu déroulant Ajouter et sélectionnez Abonnement. Configurez l’abonnement en fonction de votre scénario.

Vous pouvez ajouter d’autres clients et abonnements pour suivre le reste de ce guide.

Dans cet exemple, Hypernian facture à ses clients l’accès à ses services LLM en utilisant un modèle de tarification basé sur des frais fixes et des frais supplémentaires en cas de dépassement, avec les tarifs suivants :

Pour mettre en œuvre ce modèle, vous créez un compteur pour enregistrer l’utilisation, des produits et des prix pour représenter votre service, un client et un abonnement client.

Créer un compteur

Les compteurs indiquent comment regrouper les événements des compteurs au cours d’une période de facturation. Les événements de mesure représentent toutes les actions effectuées par les clients dans votre système (par exemple, les requêtes d’API). Les compteurs sont associés aux prix et constituent la base de ce qui est facturé.

Pour l’exemple d’Hypernian, les événements de mesure correspondent au nombre de tokens qu’un client utilise lors d’une requête. Le compteur correspond à la somme des tokens sur un mois.

Vous pouvez utiliser le Dashboard Stripe ou l’API pour configurer un compteur. Pour utiliser l’API avec la Stripe CLI pour créer un compteur, démarrer avec la Stripe CLI.

Créer le modèle de tarification

Utilisez le Dashboard Stripe ou l’API pour créer un modèle tarifaire qui inclut vos Products et leurs options tarifaires. Les Prices définissent le coût unitaire, la devise et la période de facturation.

Pour l’exemple d’Hypernian, créez un produit dont le tarif mesuré est de 0,04 USD par centaine d’unités, facturé mensuellement. Utilisez le compteur que vous avez créé à l’étape précédente.

Créez ensuite les frais mensuels .

Pour configurer un code promotionnel, créez un bon de réduction et un code promotionnel, puis appliquez le code promotionnel à un abonnement.

Créer un bon de réduction

Créez des bons de réduction dans le Dashboard ou via l’API :

Définir les produits éligibles

Lorsque vous apportez des modifications à un abonnement, Stripe calcule le prorata et applique toutes les réductions existantes. Vous ne pouvez pas appliquer de réduction supplémentaire aux postes de prorata sur la facture générée.

Appliquer des bons de réduction aux abonnements

Après avoir créé un bon de réduction, appliquez-le à un abonnement pour créer une réduction. Vous pouvez appliquer le bon de réduction lors de la création de l’abonnement ou en modifiant l’abonnement existant d’un client.

Même si un client ne dispose pas d’un moyen de paiement sauvegardé, vous pouvez toujours créer un abonnement dès lors qu’aucun paiement immédiat n’est requis après l’application d’un bon de réduction.

Appliquer des bons de réduction à Checkout

Appliquez des bons de réduction aux abonnements au cours d’une session Checkout en définissant le paramètre discounts dans l’API. Pour créer une session avec une réduction appliquée, transmettez l’ID du bon de réduction dans le paramètre coupon du tableau discounts.

curl https://api.stripe.com/v1/checkout/sessions \
  -u 
sk_test_BQokikJOvBiI2HlWgH4olfQ2
: \
  -d "payment_method_types[]"=card \
  -d "line_items[][price]"=
"{{PRICE_ID}}" \
  -d "line_items[][quantity]"=1 \
  -d mode=subscription \
  -d "discounts[][coupon]"="{{COUPON_ID}}" \
  -d success_url="https://example.com/success" \

utilisez Stripe elements et l’api checkout pour créer une page de paiement dans le cadre d’une intégration d’abonnements entièrement personnalisée.

pour configurer un abonnement, vous devez créer un client. vous pouvez collecter les adresses et les informations de paiement à l’aide de l’express Checkout element. vous pouvez ensuite utiliser ces informations pour créer l’abonnement via l’api Checkout sessions.

Configurer Stripe

Installez le client Stripe de votre choix :

# Available as a gem
sudo gem install stripe

# If you use bundler, you can add this line to your Gemfile
gem 'stripe'

ensuite, installez la cli Stripe. la cli permet de tester les webhooks et d’exécuter des appels d’api vers Stripe. ce guide montre comment utiliser la cli pour configurer un modèle de tarification.

# Install Homebrew to run this command: https://brew.sh/
brew install stripe/stripe-cli/stripe

# Connect the CLI to your dashboard
stripe login

Pour davantage d’options d’installation, consultez la page consacrée à l’interface de ligne de commande Stripe.

Créer un client

Stripe a besoin d’un objet Client pour chaque abonnement. Sur le front-end de votre formulaire d’inscription, collectez toutes les informations nécessaires sur vos utilisateurs et transmettez-les à votre back-end.

Si vous avez besoin de collecter des données d’adresse, Address Element vous permet de collecter une adresse de livraison ou de facturation pour vos clients. Pour plus d’informations sur l’Address Element, voir la page Address Element.

<form id="signup-form">
  <label>
    Email
    <input id="email" type="email" placeholder="Email address" value="test@example.com" required />
  </label>

  <button type="submit">
    Register
  </button>
</form>

const emailInput = document.querySelector('#email');

fetch('/create-customer', {
  method: 'post',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    email: emailInput.value,
  }),
}).then(r => r.json());

Sur le serveur, créez l’objet Stripe Customer.

curl https://api.stripe.com/v1/customers \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d email={{CUSTOMER_EMAIL}} \
  -d name={{CUSTOMER_NAME}} \
  -d "shipping[address][city]"=Brothers \
  -d "shipping[address][country]"=US \
  -d "shipping[address][line1]"="27 Fredrick Ave" \
  -d "shipping[address][postal_code]"=97712 \
  -d "shipping[address][state]"=CA \
  -d "shipping[name]"={{CUSTOMER_NAME}} \
  -d "address[city]"=Brothers \
  -d "address[country]"=US \
  -d "address[line1]"="27 Fredrick Ave" \
  -d "address[postal_code]"=97712 \
  -d "address[state]"=CA

Activer les moyens de paiement

Par défaut, Stripe utilise vos paramètres de moyens de paiement pour déterminer quels moyens de paiement sont activés dans le composant Express Checkout Element. Vous pouvez également configurer des moyens de paiement spécifiques dans votre session Checkout à l’aide de l’attribut payment_method_types.

Moyens de paiement pris en charge

Apple Pay et Google Pay sont automatiquement activés lorsque vous utilisez le type de moyen de paiement card. Lors de l’utilisation de Link, vous devez également transmettre le type de moyen de paiement card.

Créer la Checkout Session

Dans le back-end de votre application, définissez un endpoint qui crée la session pour que votre front-end puisse l’appeler. Vous avez besoin de l’ID de prix de l’abonnement auquel le client s’inscrit — votre front-end transmet cette valeur.

curl https://api.stripe.com/v1/checkout/sessions \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d customer={{CUSTOMER_ID}} \
  -d ui_mode=custom \
  -d "line_items[0][price]"={{PRICE_ID}} \
  -d "line_items[0][quantity]"=1 \
  -d return_url={{RETURN_URL}} \
  -d mode=subscription

Initialiser Checkout

const clientSecret = fetch('/create-checkout-session', {method: 'POST'})
  .then((response) => response.json())
  .then((json) => json.checkoutSessionClientSecret);
const checkout = stripe.initCheckout({clientSecret});
const loadActionsResult = await checkout.loadActions();
if (loadActionsResult.type === 'success') {
  const session = loadActionsResult.actions.getSession();
  const checkoutContainer = document.getElementById('checkout-container');
  checkoutContainer.append(JSON.stringify(session.lineItems, null, 2));
  checkoutContainer.append(document.createElement('br'));
  checkoutContainer.append(`Total: ${session.total.total.amount}`);
}

<div id="checkout-container"></div>

Configurer une période d’essai

Pour offrir une période d’essai gratuite de 7 jours pour votre service, transmettez trial_period_days lors de la création de la Checkout Session.

curl https://api.stripe.com/v1/checkout/sessions \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d customer={{CUSTOMER_ID}} \
  -d ui_mode=custom \
  -d "line_items[0][price]"={{PRICE_ID}} \
  -d "line_items[0][quantity]"=1 \
  -d return_url={{RETURN_URL}} \
  -d mode=subscription \
  -d "subscription_data[trial_period_days]"=7

Configurer Stripe Elements

<head>
  <title>Checkout</title>
  <script src="https://js.stripe.com/clover/stripe.js"></script>
</head>

// Set your publishable key: remember to change this to your live publishable key in production
// See your keys here: https://dashboard.stripe.com/apikeys
const stripe = Stripe(
'pk_test_TYooMQauvdEDq54NiTphI7jx');

const clientSecret = fetch('/create-checkout-session', {method: 'POST'})
  .then((response) => response.json())
  .then((json) => json.client_secret);

const checkout = stripe.initCheckout({
  clientSecret
});

Créez et montez l’Express Checkout Element.

Le composant Express Checkout Element contient une iframe qui envoie en toute sécurité les informations de paiement à Stripe via une connexion HTTPS. L’adresse de la page de paiement doit également commencer par https://, au lieu de http://, pour que votre intégration fonctionne.

<div id="express-checkout-element">
  <!-- Express Checkout Element will be inserted here -->
</div>
<div id="error-message">
  <!-- Display an error message to your customers here -->
</div>

// Create and mount the Express Checkout Element
const expressCheckoutElement = checkout.createExpressCheckoutElement();
expressCheckoutElement.mount('#express-checkout-element');

Recueillir les informations client et afficher les lignes d’articles

La session Checkout que vous avez créée sur le serveur détermine automatiquement les postes, le montant total et les moyens de paiement disponibles. Le composant Express Checkout Element utilise ces informations pour afficher l’interface adaptée.

const loadActionsResult = await checkout.loadActions();
if (loadActionsResult.type === 'success') {
  expressCheckoutElement.on('confirm', (event) => {
    loadActionsResult.actions.confirm({expressCheckoutConfirmEvent: event});
  });
}

expressCheckoutElement.on('shippingaddresschange', async (event) => {
  const response = await fetch('/update-session-shipping', {
    method: 'POST',
    headers: {'Content-Type': 'application/json'},
    body: JSON.stringify({
      sessionId: checkout.session.id,
      shippingAddress: event.address
    })
  });
  const result = await response.json();

  if (result.error) {
    event.reject();
  } else {
    event.resolve();
  }
});

expressCheckoutElement.on('shippingratechange', async (event) => {
  const response = await fetch('/update-session-shipping-rate', {
    method: 'POST',
    headers: {'Content-Type': 'application/json'},
    body: JSON.stringify({
      sessionId: checkout.session.id,
      shippingRateId: event.shippingRate.id
    })
  });
  const result = await response.json();

  if (result.error) {
    event.reject();
  } else {
    event.resolve();
  }
});

Soumettez le paiement

<button id="pay-button">Pay</button>
<div id="confirm-errors"></div>

const checkout = stripe.initCheckout({clientSecret});
const loadActionsResult = await checkout.loadActions();

if (loadActionsResult.type === 'success') {
  const {actions} = loadActionsResult;
  const button = document.getElementById('pay-button');
  const errors = document.getElementById('confirm-errors');
  button.addEventListener('click', () => {
    // Clear any validation errors
    errors.textContent = '';

    actions.confirm().then((result) => {
      if (result.type === 'error') {
        errors.textContent = result.error.message;
      }
    });
  });
}

pour configurer votre logique back-end, vous devez mettre en place un endpoint capable d’écouter les événements webhook envoyés par Stripe. ces événements sont déclenchés à chaque changement d’état dans Stripe, comme la création de nouvelles factures d’abonnement. dans votre application, configurez un gestionnaire http pour accepter une requête POST contenant l’événement webhook et vérifiez la signature de l’événement.

Pendant le développement, utilisez l’onglet Events dans Workbench pour surveiller et filtrer les événements.

En mode production, configurez une URL d’endpoint de webhook dans le Dashboard ou utilisez l’API Webhook Endpoints.

Consultez Subscription events pour plus de détails sur les webhooks spécifiques aux abonnements.

Donnez accès à votre service aux clients après un paiement réussi. Dans la plupart des cas, vous pouvez accorder l’accès à votre service lorsque :

• Vous recevez l’événement invoice.paid.
• le statut de l’abonnement est active. vous pouvez vérifier ce statut sur la page abonnements du Dashboard ou en utilisant l’api pour récupérer l’abonnement et en consultant le champ status.

Pour plus de détails sur les webhooks spécifiques aux abonnements, consultez Événements d’abonnement.

Testez votre intégration avant la mise en production.

1. Dans le Dashboard, ouvrez vos paramètres du compte.
2. Saisissez le type d’entreprise, les informations fiscales, les détails de l’entreprise, les informations personnelles de vérification et les informations visibles par les clients (par exemple, un intitulé sur le relevé bancaire).
3. Ajoutez vos coordonnées bancaires pour confirmer où vos fonds seront versés.
4. Configurez l’authentification à deux étapes pour sécuriser votre compte.
5. Vous pouvez également activer la collecte automatique des taxes ou les dons climatiques basés sur les revenus.
6. Vérifiez les informations saisies, puis cliquez sur Accepter et envoyer.
7. Après l’activation de votre profil, Stripe met à jour votre statut, passant du mode test au mode actif.

en savoir plus sur l’activation de votre compte Stripe.