how to communicate with an iframe react
const Render = () => {
useEffect(() => {
const handler = event => {
const data = JSON.parse(event.data)
console.log("Hello World?", data)
}
window.addEventListener("message", handler)
// clean up
return () => window.removeEventListener("message", handler)
}, []) // empty array => run only once
return (
<div>
<iframe
srcDoc={`
<!DOCTYPE html>
<html>
<head>
window.top.postMessage(
JSON.stringify({
error: false,
message: "Hello World"
}),
'*'
);
</head>
<body>
<h1>Content inside an iframe, who knew...</h1>
</body>
</html>
`}
/>
</div>
)
}