Skip to content

Instantly share code, notes, and snippets.

@mizchi

mizchi/portal-guest.html

Created June 4, 2021 08:21
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mizchi/84d2644a44380e7ab9f170d335123d3e to your computer and use it in GitHub Desktop.
Save mizchi/84d2644a44380e7ab9f170d335123d3e to your computer and use it in GitHub Desktop.
Download ZIP
portal communication
Raw
portal-guest.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
</head>
<body style="height: 200vh">
<h1>portal guest</h1>
<script>
portalHost.postMessage("foo");
portalHost.onmessage = (ev) => {
console.log("receive", ev);
};
</script>
</body>
</html>
Raw
portal-host.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
</head>
<body>
<h1>portal test</h1>
<portal style="width: 500px; height: 500px; border: 1px solid black;" src="/" />
<script>
const p = document.querySelector("portal");
p.onmessage = (ev) => {
console.log("event from portal", ev);
p.postMessage("send from host")
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment