Unable to load Stripe 3ds iframe on Cordova

Viewed 255

I'm having hard time trying to implement 3ds for stripe. Since I updated to cordova 10, android@9.1 and ios@6.2 I can't load anymore iframe for 3ds. The intent is set correctly and I receive 3ds text message on my Phone but I can't see the iFrameContent. I tried to change Content-Security-Policy in index.html and allow-navigation in config.xml.

These are my config.xml properties:

    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <allow-navigation href="about:*" />
    <allow-navigation href="https://*/*" />

Here how I set the CSP:

<meta
    http-equiv="Content-Security-Policy"
    content="
             connect-src * 'self' 'unsafe-inline';
             script-src * 'self' 'unsafe-inline';
             frame-src https://*.stripe.com;"
>

And this is the error I get:

error

According to stripe documentation you need to append these rules to your CSP

stripe

But still I can't load the iframe containing the 3ds.

enter image description here

Any clue? Thank you!

2 Answers

try using ionic webkit "cordova-plugin-ionic-webview", adding

    <preference name="ScrollEnabled" value="true" />
    <preference name="Scheme" value="https" />
    <preference name="MixedContentMode" value="2" />

to your config.xml (this are ionic-webview specific), last add frame-ancestors 'self' https://*.stripe.com; to your csp configuration.

It worked for me

I'm writing this for everyone who's struggling on the same issue. I managed to solve the issue by moving stripe logic and card management outside Cordova default browser wrapper (which is WKWebView). I've reached stripe support and they also think this is related to WKWebView security.

Just install cordova-plugin-inappbrowser and comunicate with your app using InAppBrowser.addEventListener

Related