Never stop loading react-native 0.63.3

[Kladislav]

No description provided.

[a-tokyo]

Hey @Kladislav ! Thanks for opening an issue!

The demo screenshot is indeed from RN 0.63.3 and we are currently using this version as well.

Can you check the logs and see if there's something else preventing the library from loading?
Also if you can reproduce with a demo, that'd be great!

[Kladislav]

Ohh, sorry, i find whats wrong. I have this bug when switching stripe to production mode. Idk where to find any error, react-native start clear

[a-tokyo]

All good! @Kladislav! Let me know if you face any issues ( :

[Kladislav]

Link to video: https://streamable.com/22vf8v
Code:
<StripeCheckout stripePublicKey={STRIPE_PUBLIC_KEY} checkoutSessionInput={{ sessionId: props.route.params.checkoutSessionId, }} onSuccess={onSuccess} onCancel={onCancel} /> )

When I switching back to dev mode Stripe. All good!

[a-tokyo]

Are you sure you're passing the correct PRODUCTION STRIPE_PUBLIC_KEY? @Kladislav

[pratibhahg]

im also facing this issue when i use PRODUCTION STRIPE_PUBLIC_KEY cannot able load stripe

[Kladislav]

@a-tokyo yes, its correct.

[a-tokyo]

Thanks for your patience guys, I have identified the issue

Live stripe integrations require https connections which is why they don't work on the simulator.
I will check if this is the case on a real device, if it's not then there's nth to be done here. If it is, then I need to figure out a way to ensure that webview is https.

[a-tokyo]

@Kladislav @pratibhahg Does this only happen on simulators or on real devices as well?

[Kladislav]

@a-tokyo Link to video: https://streamable.com/22vf8v its real device)

[arunim2405]

According to this thread
Inserting your backend endpoint instead of baseUrl : '' works for android. Can someone confirm? Also @Kladislav did you have an opportunity to test google pay on android using this package?

[Kladislav]

@arunim2405 no, we using react native iap for ios subscription

[Kladislav]

@arunim2405 i change the base url to my production api endpoint nothing changes. any ideas?

[arunim2405]

@Kladislav are you using https on your backend server?

[Kladislav]

@arunim2405 yes, wait do i need to test it only on real device?

upd. tested on emulator and real device, nothing changes, always loading(

[tkrugg]

I can confirm this happens both on simulator and real device.
But adding baseURL works on android (even on the simulator)

I changed the library code to:

[arunim2405]

I can confirm this happens both on simulator and real device.
But adding baseURL works on android (even on the simulator)

I changed the library code to:

I wonder why is it not working for @Kladislav 🤔

[Kladislav]

@arunim2405 i use my web front end url(nuxt.js), my backend url is https://site.com/api, ok i will test it soon

[Kladislav]

@arunim2405 what SSL certificate you have? do you use letsencrypt?

[Kladislav]

Problem solved. Big thanks @arunim2405 @a-tokyo

[arunim2405]

Problem solved. Big thanks @arunim2405 @a-tokyo

Congratulations 🎊 what finally solved the issue?

[MehuImpero]

Stuck in loading

[arunim2405]

Stuck in loading

Test mode or production?

[NeOMakinG]

Hey

Both for me, test mode and prod mode! (on iOS)

Edit: Nevermind, I forgot to enable checkout in the stripe BO :)

[MehuImpero]

Stuck in loading

Test mode or production?

testing mode

[arunim2405]

Stuck in loading

Test mode or production?

testing mode

Please ensure that you've enabled stripe checkout in the dashboard and you're following proper steps to generate session id. This issue only occurred in production mode and has been now fixed

[fakeheal]

Although, 54d9537 resolves this issue, here's a related answer on SO (there's another option of hosting the HTML on your server):
https://stackoverflow.com/questions/64702032/react-native-stripe-card-element-not-displaying-for-live-api-key