eltrino / magento2-hyva-checkout-stripe

5 stars 2 forks source link

Stripe checkout flow not supported #9

Open Dave-W opened 1 month ago

Dave-W commented 1 month ago

We use the "Redirect customers to Stripe Checkout" payment flow. Has there been any work done on support for this ?

I've been trying to reverse engineer the Magento payment module to try and figure out how to support it. It appears as a different payment method code, rather than appearing as "stripe_payments" it appears with the code "stripe_payments_checkout" so I can add a second payment form and order submit method, just struggling to figure out how to render the appropriate form as "PaymentElement" shows the normal stripe card details form.

We could potentially change to a more traditional flow but we also offer Klarna and other pay in installment options through the Stripe payment screen.

odi-um commented 1 month ago

Hi @Dave-W,

A better approach might be to follow the Stripe documentation. We found it much clearer than trying to reverse-engineer Magento's native checkout, especially given the extra code involved in the checkout process itself.

From what I see in the docs, there are two options for checkout: hosted or embedded. In both cases, you should not render the PaymentElement. For the hosted option, you simply need to redirect to Stripe’s site, and for the embedded option, you can use the EmbeddedCheckoutProvider React component.

You'll need to create an additional component alongside "Cards", declare it in renderers.js, and implement it as an additional payment method for handling stripe_payments_checkout.

The tricky part will likely be properly handling the returning customer. Ideally, the customer should be redirected to the controllers defined in the Magento Stripe module (\StripeIntegration\Payments\Controller\Payment\Index), so that existing functionality can be reused. Your main task will be to correctly initialize the checkout session in Hyvä Checkout, and the rest should be handled by the existing code.

We primarily used code examples for the React/Node stack from here: https://docs.stripe.com/checkout/quickstart