Payment Sheet failed on IOS

[anonimitoraf]

Platform

• [ ] Web
• [X] iOS - Capacitor 4
• [ ] Android

Describe the bug When I attempt to open a Payment Sheet on IOS, it briefly closes afterwards with the event paymentSheetFailed. Happy to share more info if needed.

https://user-images.githubusercontent.com/15933322/202311955-5b95c705-3ec8-4b01-95a6-e7d976562182.mov

Additional context We've followed the setup documentation: https://stripe.capacitorjs.jp/docs/configuration and https://stripe.capacitorjs.jp/docs/initialize (React)

JS code:

const createRes = await stripe.createPaymentSheet({
  paymentIntentClientSecret: clientSecret,
  customerEphemeralKeySecret: ephemeralKey,
  customerId: userId,
})
console.log({ createRes })
const paymentResult = await stripe.presentPaymentSheet()
console.log({ paymentResult })

[anonimitoraf]

If it's any help, I see this log msg:

⚡️  To Native ->  Stripe createPaymentSheet 102192725
2022-11-17 10:55:17.501460+1100 App[21430:12401144] LOG ANALYTICS: ["app_version": "development", "event": "mc_complete_init_customer", "publishable_key": "pk_test_51M4Cs7KOkM8rg8niy7h5cCOilVizSXNUGkXkXatuRDzdqr0TkTCH87pZohZhWggAuDfGW2JidH7yggPKvWjmfwxE009HfocPyh", "pay_var": "paymentsheet", "mpe_config": ["customer": true, "appearance": ["font": false, "usage": false, "shadow": false, "corner_radius": false, "border_width": false, "colors": false, "primary_button": false], "style": 0, "allows_delayed_payment_methods": false, "save_payment_method_opt_in_behavior": "automatic", "apple_pay_config": false, "return_url": false, "default_billing_details": false], "app_name": "App", "device_type": "arm64", "session_id": "995c9288-3d06-4ecb-9dbf-47330b14b556", "analytics_ua": "analytics.stripeios-1.0", "ocr_type": "none", "os_version": "16.1", "is_development": true, "bindings_version": "23.0.0", "product_usage": ["PaymentSheet"], "install": "C", "plugin_type": "cordova", "apple_pay_enabled": 1, "additional_info": []]

Also, as per this comment, I've made sure that we use ephemeralKey.secret as opposed to ephemeralKey.id

[vesvello]

I have the same issue.

[log] - --------stripe------- 2022-12-15 02:29:42.178693-0600 App[48055:9609258] LOG ANALYTICS: ["apple_pay_enabled": 1, "is_development": true, "install": "C", "device_type": "x86_64", "session_id": "16cce8b1-02e1-4604-b3d0-81e277b50b67", "os_version": "16.1", "product_usage": ["PaymentSheet"], "publishable_key": "unknown", "app_name": "App", "bindings_version": "23.0.0", "mpe_config": ["customer": true, "save_payment_method_opt_in_behavior": "automatic", "appearance": ["usage": false, "font": false, "border_width": false, "colors": false, "corner_radius": false, "primary_button": false, "shadow": false], "style": 0, "return_url": false, "default_billing_details": false, "apple_pay_config": false, "allows_delayed_payment_methods": false], "ocr_type": "none", "analytics_ua": "analytics.stripeios-1.0", "pay_var": "paymentsheet", "app_version": "1.0", "event": "mc_complete_init_customer", "plugin_type": "cordova", "additional_info": []] ⚡️ TO JS {} ⚡️ TO JS {} ⚡️ To Native -> Stripe ⚡️ [log] - PaymentSheetEventsEnum.Loaded presentPaymentSheet 114898807 ⚡️ TO JS {"error":"There was an unexpected error -- try again in a few seconds"} ⚡️ TO JS {"paymentResult":"paymentSheetFailed"} ⚡️ [log] - PaymentSheetEventsEnum.Failed

I am sending the correct keys

[log] - --------payment_intents------- ⚡️ [log] - pi_3MFC****I6G1253fDET_secret_bH1wwR****KAMklrRsFVyyc ⚡️ [log] - --------ephemeral_keys------- ⚡️ [log] - ek_test_YWNjdF8xTT****VFaZ200STZHLGpIN0VuTm9DUW9kb**4Z0dEeGhCYXY_00dxxMJyVt

Any help?

EDITED:

It was a problem with Stripe.initialize If you have this error... double check its initialazing correctly

[rdlabo]

This is almost always caused by an incorrect key when initializing or starting up the PaymentSheet. First, check the demo to make sure it works with the correct keys:

https://github.com/capacitor-community/stripe/tree/master/demo/angular

Thanks.