Chrome userscript error: "Unsafe JavaScript attempt to access frame"
// the iframe of the div I need to access
var iframe = document.getElementsByTagName("iframe")[2];
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
// resize 'player' in the iframe
innerDoc.getElementById('player').width = "1000px";
innerDoc.getElementById('player').height = "650px";
Running in a userscript for this url: http://www.free-tv-video-online.me/player/sockshare.php?id=24DA6EAA2561FD60
Why does Chrome come out with this error and fail the script?:
Unsafe JavaScript attempt to access frame with URL http://www.sockshare.com/embed/24DA6EAA2561FD60
from frame with URL http://www.free-tv-video-online.me/player/sockshare.php?id=24DA6EAA2561FD60.
Domains, protocols and ports must match.
(I'm only a basic Javascript user)
Final code, many thanks to the answerer:
// ==UserScript==
// @name Resize
// @include http://www.free-tv-video-online.me/player/sockshare.php*
// @include http://www.sockshare.com/*
// ==/UserScript==
if (!(window.top === window.self)) {
var player = document.getElementById('player');
setSize(player);
}
function setSize(player) {
player.style.setProperty("width", "1000px");
player.style.setProperty("height", "650px");
}
Answer
It's true that ordinary javascript cannot access iframe content, that's on a different domain, for security reasons. However, this by no means stops userscripts in Chrome, Tampermonkey or Greasemonkey.
You can process iframed content in a userscript because Chrome (and Firefox) process iframe'd pages just as if they were the main page. Accounting for that, scripting such pages is a snap.
For example, suppose you have this page at domain_A.com:
<html>
<body>
<iframe src="http://domain_B.com/SomePage.htm"></iframe>
</body>
</html>
If you set your @match directives like this:
// @match http://domain_A.com/*
// @match http://domain_B.com/*
Then your script will run twice -- once on the main page and once on the iframe as though it were a standalone page.
So if your script was like this:
// ==UserScript==
// @name _Test iFrame processing in Chrome and Tampermonkey
// @match http://domain_A.com/*
// @match http://domain_B.com/*
// ==/UserScript==
if (/domain_A\.com/i.test (document.location.href) ) {
//Main page
document.body.style.setProperty ("background", "lime", "important");
}
else {
//iFrame
document.body.style.setProperty ("background", "pink", "important");
}
You would see the main page in lime-green, and the iframed page in pink.
Alternatively, you can test like this:
if (window.top === window.self) {
//--- Code to run when page is the main site...
}
else {
//--- Code to run when page is in an iframe...
}
As you discovered (per comment on another answer), you can disable the same origin policy on Chrome. Don't do this! You will leave yourself open to all kinds of shenanigans set up by bad people. In addition to evil sites, many nominally "good" sites -- that allow users to post content -- could potentially track, hack, or spoof you.