Home / All Integrations / Stripe

pro

Connect Stripe to your chatbot

Accept payments in your CSML chatbots


Securely accept payments in your chatbots with the Stripe integration

Stripe makes it easy to collect payments on websites and applications. Using this integration, you will also be able to collect payments from your chatbot and enhance your business!

Usage

To use this App, you will need a fully setup Stripe account and a set of API keys, which you can generate here: https://dashboard.stripe.com/apikeys (for testing purposes, you should use test keys, which you can generate here).

As explained on Stripe's documentation, collecting a payment via Stripe is a 2-step process:

  1. First, generate a PaymentIntent with the stripe app
  2. Then, display the payment form in the chatbot (webapp only)

Generating the PaymentIntent

The general flow of the PaymentIntent is outlined here: https://stripe.com/docs/payments/accept-a-payment?platform=web&ui=elements#web-create-payment-intent.

After installing and setting up the Stripe integration, you need to call it in your CSML flow:

// amount is expressed in cents and must be an integer
do payment_intent = App("stripe", method="payment_intent", amount=4299, currency="USD")

// ALWAYS verify that this call was successful
if (!payment_intent.success) {
  say "Error: {{payment_intent.message}}"
  goto end
}

Displaying the payment form

If (and only if) the payment_intent call was successful, you can proceed with displaying the Stripe payment form in your chatbot.
You can set several options to configure the appearance of your payment form:

say Stripe(
  payment_intent.data, // REQUIRED
  style = {
    "title": "MyBotShop",
    "background_color": "#2965FF",
    "color": "#ffffff",
    "submit_label": "Pay Now!",
    "description": "Lorem ipsum dolor sit amet consectetuer",
    "logo_url": "https://cdn.clevy.io/clevy-logo-square-white.png",
    "card_details_label": "Card details",
    "postal_code_label": "Postal code",
    "receipt_email_label": "Receipt email",
  },
  receipt_email = "john@doe.com", // optionally prefill data, or set to false to skip field
  postal_code="12345", // optionally prefill data, or set to false to skip field
)

All parameters except the first one are optional, and default to sensible values. You can skip the postal_code verification (by setting this parameter explicitely to false) but it is recommended to avoid fraud.
You can also skip the receipt_email parameter by setting it to false if you want to send the receipt manually.

Upon clicking on the submit button, the payment will be processed. If additional verifications are required (3D Secure, etc.), a popup will be displayed to the user to perform the necessary actions.

Securely verifying that the payment was successful

After the payment was made, you should always verify server-side that the return value from the input field is correct, before sending the product or continuing with the order process.

say Stripe(...)
hold

// Client inputs should never be trusted, especially for payment confirmation!
// Use the Stripe app's confirm_payment method to check that it was indeed successful:
do confirmation = App("stripe", method="confirm_payment", data=payment_intent.data)

if (!confirmation.success) {
  say "Error details: {{confirmation.message}}" 
  say "There was an issue, let's try again!"
}

else {
  say "Congrats! The payment was successful."
}

Testing your integration

There are two ways you can test the integration without charging live credit cards:

Using Stripe-provided credit cards is the best method, as you will also be able to test various authentication flows, countries, requirements for CVC, postal code…

Discover similar integrations:
Klarna
Paypal

Join the Community
on Slack Slack

Come and learn all about CSML with other chatbot enthusiasts on the CSML Community Slack! ūü§ó