Umbraco Commerce Custom Payment Provider - Stripe Embed

Hi,

We are looking to implement Stripe on Umbraco Commerce but our client would like to use Stripe’s Embedded form option, rather than the hosted solution. As far as I can tell, the Stripe connector that exists, only handles the hosted version (where you are sent off to Stripe and then return). I am assuming it is possible to implement the Embedded solution by creating a custom provider, but before I delve deep into that area I wanted to check

a - if it is possible to do an embedded version based on the way the Umbraco Commerce Custom Provider framework works

b - if there are any pointers (beyond this documentation Payment Providers | Umbraco Commerce )

c - whether this sounds like a lot of work

Any help would be greatly appreciated.

Ben

It is possible, and you can use the existing payment provider but it’s not exactly strait forward. There is a bit of an example in our headless demo store (See Umbraco.Headless.Demo/lib/umbraco/index.ts at frontend/dev · umbraco/Umbraco.Headless.Demo · GitHub) which uses the Storefront API to initialize and confirm an inline transaction, however there is a middle step where the Stripe provider needs to update the payment details (See Umbraco.Headless.Demo/components/checkout/stripe-payment-form.tsx at frontend/dev · umbraco/Umbraco.Headless.Demo · GitHub)

  1. Initialize the transaction
  2. Render the stripe form
  3. Customer fills in form and submits
  4. Stripe returns via JS the payment indent details
  5. You send that back to the payment methods callback URL as per above
  6. Once that is successful you then confirm the transaction

It’s all very custom.

The main reason we suggest the hosted solution is that it’s much simpler and you bare non of the security responsibilities.

1 Like

Thanks Matt, that’s all really useful info. Unless there is a real need I would agree it is much better to go with the hosted solution. I will liaise with our client and see what they want to do.