We’ve developed an Ionic based webshop app. The customer select articles and go to checkout. If the user chooses to pay by credit card, they are taken to a new view where a credit card form is shown. This credit card form is hosted by DIBS and we load it by posting to an Iframe. When the user has entered their credit card data they are usually redirected to a 3DSecure page, where they are asked to authenticate using their banks method of authentication. When they’ve done that, they are redirected to one of our own pages (which sends data back to Ionic using event handlers, so that Ionic knows we’re finished with the payment). The entire process of credit card payment takes place within this Iframe.
If the users device is a Samsung phone, they never get to the 3DSecure part. They get to fill in their credit card information and when they press the button to continue (and be redirected to the 3DSecure page) the Iframe gets blank and nothing more happens. We’ve tried on Galaxy S6 Edge, Galaxy S4 and those devices have this issue. Both Android 4.4 and Android 5. We’ve tried on Galaxy Nexus and Nexus 6, which don’t have this issue.
We’ve tried inspecting the app in Chrome developer tools while running the app on device. This shows us that when we are pressing the button to post the credit card information and go to the 3DSecure page, the request (POST) “stalls” and get stuck on “pending” status. We never get any response. There are no errors or anything to help us. It’s just stuck…
We’ve tried to use an Cordova InAppBrowser as well but the issue remains.
Configuration holds this element
<access origin="*" />
Ionic version is 1.3.22. Cordova version is 5.0.0.
What could be the cause of this problem, and how to solve it?