Dealing with Stripe.js load failure

[pgib]

Summary

We've had some cases where people's "security" software have blocked the request to https://js.stripe.com/v3/, and I'd like to be able to elegantly detect this.

The component that's wrapped inside the <StripeProvider> ends up exceptioning out like so:

I simulate this locally by adding the following line to my /etc/hosts file:

127.0.0.1 js.stripe.com

Is there any way to handle this? We haven't updated to React 16 (hopefully soon), and I know it will be easier to display an error, but it seems like there should be some way to handle this just within the component.

[asolove-stripe]

@pgib thanks for reporting and sorry for the slow response. We've definitely seen this problem with stripe.js getting blocked too.

I like the idea of using an ErrorBoundary to catch this, but I'm going to poke at whether we can also just handle this more gracefully internally.

[mAAdhaTTah]

We've definitely been seeing that error in our app, and Stripe is the most likely culprit. That said, it kinda looks like this library has been abandoned, so I'm not sure this is going to get resolved.

[hofman-stripe]

If you have updated to React 16 and can update your integration, switching to @stripe/react-stripe-js and loadStripe() should solve the surfacing of load errors. The promise returned by loadStripe() will be rejected if the stripe.js script failed to load.

If you cannot, I'd recommend looking at our loader's source, and perform similar operations depending on how you load stripe.js today:

• If you include a <script src="https://js.stripe.com/v3/"></script> tag in your document, checking if window.Stripe exists would confirm that Stripe.js was loaded.
• If you dynamically inject the script tag, adding an onerror event handler should let you know if the script failed to load.

[sashko-stripe]

Closing this as it's a relatively old issue and this project has migrated to React Stripe.js. If you believe this is still important, please re-open it there.