I would like to ask a weird situation we have due to the PSD2.
There are two flows in a checkout process: when it is his first checkout, and when the user has previously entered the credit card information.
When in his first checkout: In the checkout page with the products he would buy, the user clicks on "Buy", loading a new page, this being the bank page (the user's bank) to introduce the credit card info and when the user clicks on "Save" loads a new page with a SMS confirmation of the same bank. After the user fills the SMS field bank validation and clicks "Confirm", it goes to our thank-you page (our page, not the bank).
When the user has entered the credit card information already (has already bought something), the credit cards used appears in the final checkout step and after selection and clicks on "Buy", it goes directly to the thank-you page (our page, not the bank).
But with the PSD2 implementation this last step changes.
Now, after clicks "Buy" with the credit card selected, it will not go to the thank-you page, instead, it will go to the user's bank page with a validation (not only SMS, push notification, etc) and after the user fills the field, it will go to the thank-you page.
After speaking with the provider, this step must go in an
<iframe> or popup window. Which is the best solution for this?
I think that a explanatory copy will be the best one near the "Buy" button, but we can't embed an
<iframe>, since each bank will be different (each one using different background colours) so if we use out header and footer it will be weird, and using a popup windows will have problems due to blockers on the browser.
Any thoughts on how to provide a seamless checkout experience with these constraints?