'Listener Within IFrame Not Called When Submitting postMessage()
I need my parent page to communicate an instruction to the child iframe. I found out that due to cross-origin issues, I must use iframe.contentWindow.postMessage()
.
I'm calling the iFrame from within the parent using:
Parent.js
const iFrame = myComponent.current.componentDomElement.childNodes[0]
const result = iFrame.contentWindow.postMessage('test', '*')
In the child, I then want to handle it via: myComponent.js
window.addEventListener('message', event => {
console.log({event})
})
I can see event
being logged many times when the page loads, but not once after I manually trigger it with this Parent.js
function.
Why is it not being triggered?
Edit:
I can see someone casted a vote to close this question due to lack of clarity. Can you explain what you're missing? I've provided all the details I assumed would be relevant, but if there's anything I'm missing I'm happy to add it.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|