Menu
I have a HTML Document which contains an iframe. Whenever I try to access or modify this iframe with JS I get Error: Permission denied to access property "document".
I am using frame.contentWindow.document.body.innerHTML or frame.contentWindow.document.body.onload or similar such attributes to access or modify the iframe. (In the given code the iframe is referred to as frame.)
For the web-app I am developing, access to these attributes are necessary and I can't do without these (or similar alternatives).
570
Just do an "chmod +x log" to fix that perm and you should be able to access it.
While using Linux, you may encounter the error, “permission denied”. This error occurs when the user does not have the privileges to make edits to a file. Root has access to all files and folders and can make any edits. Other users, however, may not be allowed to make such edits.
Accessing and then modifying webpages in iframes of other websites is known as Cross-site scripting or XSS and it is a technique used by malicious hackers to prey on unsuspecting victims.
A policy by the name of "Same-Origin Policy" is implemented by browser makers to prevent such behaviour and arbitrary execution of JS code.
This error can be prevented by hosting the parent document and the document in the iframe in the same domain and subdomain, and making sure that the documents are loaded using the same protocol.
Examples of Incompatible Pages:
http://www.example.org & http://www.example2.com http://abc.example.org & http://xyz.example.com http://www.example.org & https://www.example.com Cross-Origin Resource Sharing is a solution to this problem.
For Example:
If http://www.example.com would like to share http://www.example.com/hello with http://www.example.org, a header can be sent with the document which looks like the following:
Access-Control-Allow-Origin: http://www.example.org To send it with HTML just put it in a <META HTTP-EQUIV="..."> tag, like this:
<head> ... <META HTTP-EQUIV="Access-Control-Allow-Origin" CONTENT="http://www.example.org"> ... </head> You can still bypass this issue with the help of YQL even though you don't have access to the header part of the receiving window. With the Postmessage method also you need to edit the recipient window script. But using this method you can load any iframe without touching their scripts. Check this out!
<html> <iframe src="https://google.com/" width="500" height="300"></iframe> <script> var iframe = document.getElementsByTagName('iframe')[0]; var url = iframe.src; var getData = function (data) { if (data && data.query && data.query.results && data.query.results.resources && data.query.results.resources.content && data.query.results.resources.status == 200) loadHTML(data.query.results.resources.content); else if (data && data.error && data.error.description) loadHTML(data.error.description); else loadHTML('Error: Cannot load ' + url); }; var loadURL = function (src) { url = src; var script = document.createElement('script'); script.src = 'https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20data.headers%20where%20url%3D%22' + encodeURIComponent(url) + '%22&format=json&diagnostics=true&env=store%3A%2F%2Fdatatables.org%2Falltableswithkeys&callback=getData'; document.body.appendChild(script); }; var loadHTML = function (html) { iframe.src = 'about:blank'; iframe.contentWindow.document.open(); iframe.contentWindow.document.write(html.replace(/<head>/i, '<head><base href="' + url + '"><scr' + 'ipt>document.addEventListener("click", function(e) { if(e.target && e.target.nodeName == "A") { e.preventDefault(); parent.loadURL(e.target.href); } });</scr' + 'ipt>')); iframe.contentWindow.document.close(); } loadURL(iframe.src); </script> </html> If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
