question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

initPaymentSheet error

See original GitHub issue

Describe the bug When using initPaymentSheet it always returns an error:

{code: "Failed", localizedMessage: "There was an unexpected error -- try again in a few seconds", message: "There was an unexpected error -- try again in a few seconds", declineCode: null, type: null, …}

Also getting the same error on presentPaymentSheet (if I use confirmPayment: false the Payment Sheet doesn’t open at all, if I don’t use it then it opens and closes automatically with the same error).

Using iOS, I haven’t tested this on Android.

My code:

Server

exports.paymentSheet = functions.https.onRequest(
  async (req, res) => {
  const customer = await stripe.customers.create();
  const ephemeralKey = await stripe.ephemeralKeys.create(
    {customer: customer.id},
    {apiVersion: '2020-08-27'}
  );
  const paymentIntent = await stripe.paymentIntents.create({
    amount: 1099,
    currency: 'usd',
    customer: customer.id,
  });
  res.json({
    paymentIntent: paymentIntent.client_secret,
    ephemeralKey: ephemeralKey.secret,
    customer: customer.id
  });
});

Client

  const fetchPaymentSheetParams = async () => {
    const response = await fetch(`${API_URL}/paymentSheet`, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
    });
    const {paymentIntent, ephemeralKey, customer} = await response.json();

    return {
      paymentIntent,
      ephemeralKey,
      customer,
    };
  };

  const initializePaymentSheet = async () => {
    const {paymentIntent, ephemeralKey, customer} =
      await fetchPaymentSheetParams();

    const {error, paymentOption} = await initPaymentSheet({
      customerId: customer,
      customerEphemeralKeySecret: ephemeralKey,
      paymentIntentClientSecret: paymentIntent,
      customFlow: true,
      merchantDisplayName: 'Example Inc.',
      style: 'alwaysDark',
    });

    setLoading(false);
    if (error) {
      Alert.alert(`Error code: ${error.code}`, error.message);
    }
    // updateButtons(paymentOption);
  };


  useEffect(() => {
    initializePaymentSheet();
  }, []);

Btw, this is a duplicate of #461 sorry couldn’t reopen the issue.

Versions

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:18

github_iconTop GitHub Comments

1reaction
Alex30555commented, Oct 15, 2021

Hello,

I have the same issue using @stripe/stripe-react-native": “0.2.2”…

When I call the presentPaymentSheet, the modal disappears with this error message Error code: Failed There was an unexpected error -- try again in a few seconds

See the following video:

https://user-images.githubusercontent.com/8127893/137519765-7a90bae9-4e02-4844-9453-200736df04a7.mov

Any ideas?

Thanks!

0reactions
Brainiliocommented, Jan 12, 2022

i’m currently running these versions: “react”: “17.0.1”, “react-dom”: “17.0.1”, “react-native”: “0.64.3”, “expo”: “^44.0.0”, “@stripe/stripe-react-native”: “0.2.3”,

upgrading to expo 42/43 from 41 solved it for me too.

Happy to hear that!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Flutter web Stripe Error: WebUnsupportedError - Stack Overflow
The error I get is Error: WebUnsupportedError: initPaymentSheet is not supported for Web i don't know how to make it work on the...
Read more >
Accept a payment | Stripe Documentation
Collect payment details​​ After the customer completes the payment, the sheet is dismissed and the promise resolves with an optional StripeError< ...
Read more >
Payment Sheet - Flutter Stripe - docs.page
Next, integrate Stripe's prebuilt payment UI into your app's checkout. First you need to inititalize the payment sheet. Future<void> initPaymentSheet ...
Read more >
@stripe/stripe-react-native
An object with an error field if something went wrong or the flow was cancelled, ... Returns { loading: boolean; initPaymentSheet: (params: SetupParams) ......
Read more >
Mastering Stripe PaymentSheet in React Native with Expo
PaymentSheet, on the other hand, takes care of error handling for you, ... Then, we initialize the PaymentSheet using the initPaymentSheet() ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found