iframe redirect break out from parent page and make parent redirect

1 day ago 3
ARTICLE AD BOX

I am using the ASP plugin to accept credit card payments in my website:
https://wordpress.org/plugins/stripe-payments/

This plugin has a shortcode, that displays a button, that when clicked, it opens a popup with the contents of this url:
https://webfor99.com/asp-payment-box/?product_id=4095
https://snipboard.io/rkLZEc.jpg
When a transaction is either approved or denied, it redirects to the corresponding "Thank you" or "Error" page.

However, I need a solution on page (instead of a button). So I embedded the url directly in an iframe on page. It works great, the only issue is that it is not redirecting to the corresponding "Thank you" or "Error" page (neither the iframe or the parent). Check screenshots:
https://snipboard.io/UPQ9aM.jpg

https://snipboard.io/S4as0G.jpg

I need the iframe redirection to break out from the iframe into the parent page and redirect the parent page the corresponding "Thank you" or "Error" page.

I talked to the plugin support devs, and they advised me:

If you wanted to do your own customization with iframe approach (e.g. cross-domain), you could try to have the parent page listen for a postMessage from the iframe and do window.top.location.href = ...

So I came up with this code:

// Listen for messages from the iframe window.addEventListener("message", function(event) { // SECURITY: Verify the origin of the message //if (event.origin !== "https://webfor99.com/asp-payment-box/?product_id=4095") //return; // Check if the message indicates a success/redirect if (event.data && event.data.action === 'redirect') { alert(event.data) // Redirect the parent page to the new URL window.top.location.href = event.data.url; } }, false);

However, it is still not redirecting the parent, and I ran out of ideas. Any extra set of eyes that could help me? Please help, thank you!

Read Entire Article