How to redirect on HTMLElement iFrame event

Ask the community
, ,
1

I’ve been given an iFrame, with the code

<iframe width="100%" height="550px" src="https://somelink_or_other>  //modified the link for privacy
</iframe>

It’s for a calendar, which is supposed to redirect to a different page when a session is booked.

The app developers who provided the iFrame for this website, also provided the following script in order to list to the iframe and do the redirect:

<script>
var receiveMessage = function(event){
var data = event.data;
var eventName = data.substring(0, data.indexOf('.')); if (eventName === 'appointeddBookingConfirmed') {
window.location.href = "https://www.something_or_other.com/booking-request-received";
}
}; window.addEventListener("message", receiveMessage, false);
</script>

Obviously, this code won’t work as-is, and I’m aware that we need to send and receive messages from the iFrame as described here: Velo: Working with the HTML iframe Element | Help Center | Wix.com
However, I haven’t figured out how and where to put and adjust the code above in order to make it send the relevant notification to the Wix page code.
I’ve been told that in fact the iFrame is an iFrame within an iFrame, and therefore nothing we put in it will get to the Wix page code.
What is the way to work with this?
Appreciate your advice!

2

Use:
window.top.location.href = " https://www.something_or_other.com/booking-request-received ";

instead of:
window.location.href = " https://www.something_or_other.com/booking-request-received ";

3

When i try that I get the following error:

Unsafe attempt to initiate navigation for frame with origin 'https://editor.wix.com' from frame with URL... (iframe url script)

How can I add the allow-top-navigation to the Wix iframe?
or how to send message from iframe script to page velo code?
Normal method described in documentation doesn’t work:
My Iframe script:

window.parent.postMessage("success");

Velo script:

export function html1_message(event) {
    console.log(event);
}

This doesn’t seem to be doing anything

4

Use:
window.parent.postMessage(“Write someting”, “Your website URL”);

Instead of:
window.top.location.href = " https://www.something_or_other.com/booking-request-received ";

It will send a message to your page.
then write this in onReady function of your page code.

$w("HTML Component ID").onMessage( (event) => {
    wixLocation.to("URL where you want to redirect")
    
  } );