Community plugin Stripe, presentPaymentSheet not working

Hello,
I’ve installed @capacitor-community/stripe, I followed the configuration described in the documentation but after calling the createPaymentSheet the presentPaymentSheet() function is not called, here is my code:

async paymentSheet() {
let httpHeaders = new HttpHeaders( {
‘Content-Type’: ‘application/x-www-form-urlencoded’,
Authorization: Bearer ${environment.stripe.secretKey}
})

let body = new URLSearchParams({
  'amount' : `100`,
  'currency': 'eur',
  'description': `description of payment`,
})

const data$ = this.http.post<{
  client_secret: string;
}>(environment.stripe.api + 'payment_intents', body, { headers : httpHeaders}).pipe(first())

 const { client_secret } = await lastValueFrom(data$);

console.log('createPayment: ', client_secret)



// prepare PaymentSheet with CreatePaymentSheetOption.
const createPayment = await Stripe.createPaymentSheet({
  paymentIntentClientSecret: client_secret,
  merchantDisplayName: 'Dockbooking',

});

// present PaymentSheet and get result.
const result = await Stripe.presentPaymentSheet();
console.log('result: ', result)
if (result && result.paymentResult === PaymentSheetEventsEnum.Completed) {
  // Happy path
}

}

are you testing on a real device?
do you have any error in console?

no I’m testing it in localhost, but there is no error in the console, the paymentIntent is created in the stripe dashboard, while debugging I saw that the code after calling the createPaymentSheet does not go ahead. I’m reading the plugin documentation and it specifies this:

Props paymentIntentClientSecret, customerId, customerEphemeralKeySecret are required.

I don’t pass the 2 parameters "customerEphemeralKeySecret " and “customerId” could this be the problem?

Try it on a real device first, maybe it’s simple as it

it doesn’t work in the browser… it is deprecated.

Ok,
thank you all for the replies, I have however advised those who take care of the backend to provide me with the APIs necessary to create the payment intent, in the meantime I will try to build it on a real device.

there is code in the videos i linked to that show how to build a simple node server to test the API yourself so you don’t need to wait for it to be added by someone else. It will probably take less that 10 minutes to build the endpoint for the payment intent

Yes, i saw your article and even though i am using angular i found it very clear.
I have now configured the plugin to use it with Stripe Connect and everything works.
Thanks again

glad it worked our, maybe i should do an angular one to round everything out !!

1 Like

Good example, a point about the browser no longer supported
Does it work on a simulator as I see a white box appear with the loading circle and then drops back down