Last active
December 19, 2019 17:27
-
-
Save andersonba/2fc9ee4c047b31d79893f0a9f6b4a579 to your computer and use it in GitHub Desktop.
Proof of concept: Frame boundaries https://codesandbox.io/s/frame-boundaries-mp3ys
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<title>iframe A</title> | |
<script> | |
window.myDate = new Date(); | |
window.myString = new String('A'); | |
</script> | |
</head> | |
<body bgcolor="#e5edff"> | |
myDate = <span id="var1"></span><br /> | |
<strong>instanceof Date is <span id="val1"></span></strong> | |
<hr /> | |
myString: <span id="var2"></span><br /> | |
<strong>instanceof String is <span id="val2"></span></strong> | |
<script> | |
window.myDate = new Date(); | |
document.getElementById('var1').innerText = window.myDate.toISOString(); | |
document.getElementById('val1').innerText = window.myDate instanceof Date; | |
document.getElementById('var2').innerText = window.myString; | |
document.getElementById('val2').innerText = window.myString instanceof String; | |
</script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<title>iframe B</title> | |
<script> | |
window.myDate = new Date(); | |
window.myString = new String('B'); | |
</script> | |
</head> | |
<body bgcolor="#e5ffec"> | |
myDate = <span id="var1"></span><br /> | |
<strong>instanceof Date is <span id="val1"></span></strong> | |
<hr /> | |
myString: <span id="var2"></span><br /> | |
<strong>instanceof String is <span id="val2"></span></strong> | |
<script> | |
window.myDate = new Date(); | |
document.getElementById('var1').innerText = window.myDate.toISOString(); | |
document.getElementById('val1').innerText = window.myDate instanceof Date; | |
document.getElementById('var2').innerText = window.myString; | |
document.getElementById('val2').innerText = window.myString instanceof String; | |
</script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<html lang="pt-bt"> | |
<head> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<title>Proof of concept: Frame boundaries</title> | |
<script> | |
var securityErrorFound = false; | |
function getVar(iframeIndex, varName) { | |
return window.frames[iframeIndex].window[varName]; | |
} | |
function output(name, txt) { | |
el = document.getElementById(`output${name}`); | |
el.innerHTML += `${txt}<br />`; | |
} | |
function checkSecurityError() { | |
// https://stackoverflow.com/questions/25893006/uncaught-securityerror-blocked-a-frame-with-origin-null-from-accessing-a-fram | |
try { | |
window.frames[0].window.Date(); | |
} catch(e) { | |
if (!securityErrorFound) { alert(`Error: ${e.message}`); }; | |
securityErrorFound = true; | |
throw e; | |
} | |
} | |
function iframeOnload(name, index) { | |
checkSecurityError(); | |
output(name, `<strong>myDate instanceof Date</strong>: ${getVar(index, 'myDate') instanceof Date}`) | |
output(name, `<strong>myString instanceof String</strong>: ${getVar(index, 'myString') instanceof String}`) | |
} | |
</script> | |
</head> | |
<body> | |
<h1 style="margin-bottom:0">Frame boundaries</h1> | |
<h3 style="margin-top:0;color:#555;font-weight:normal">Proof of concept</h3> | |
<table border="1"> | |
<tr> | |
<th>context</th> | |
<th> | |
iframe A | |
<br />(<a href="a.html" target="_blank">a.html</a>) | |
</th> | |
<th> | |
iframe B | |
<br />(<a href="b.html" target="_blank">b.html</a>) | |
</th> | |
</tr> | |
<tr> | |
<td>inside of iframe</td> | |
<td><iframe src="a.html" onload="iframeOnload('A', 0)" frameborder="0" style="height:110px"></iframe></td> | |
<td><iframe src="b.html" onload="iframeOnload('B', 1)" frameborder="0" style="height:110px"></iframe></td> | |
</tr> | |
<tr> | |
<td>outside of iframe</td> | |
<td><div id="outputA" style="margin:8px"></div></td> | |
<td><div id="outputB" style="margin:8px"></div></td> | |
</tr> | |
</table> | |
<br /> | |
<a href="https://stackoverflow.com/questions/643782/how-to-check-whether-an-object-is-a-date#comment38499658_643827" target="_blank"> | |
Reference | |
</a> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment