javascript 更改 iframe 内 iframe 的 src

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/22625764/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 23:29:01  来源:igfitidea点击:

Changing src of iframe inside iframe

javascriptjqueryhtmliframe

提问by mah.cr

I'm getting this problem in Chrome (Running the files locally) when I try to change the src of an Iframe inside iframe, I am getting this Error Message

当我尝试在 iframe 中更改 iframe 的 src 时,我在 Chrome(在本地运行文件)中遇到此问题,我收到此错误消息

Error = Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "null" from accessing a frame with origin "null". Protocols, domains, and ports must match.

错误 = 未捕获的安全错误:无法从“HTMLIFrameElement”读取“contentDocument”属性:阻止原点为“null”的框架访问原点为“null”的框架。协议、域和端口必须匹配。

This the code that I'm using to retrieve the iframe

这是我用来检索 iframe 的代码

iframe = $("iframe").contents().find('iframe');
iframe.attr("src", url);`

I don't get this issue when I upload the files to the server. But if I open them locally I get the error.

当我将文件上传到服务器时,我没有遇到这个问题。但是,如果我在本地打开它们,则会出现错误。

It works good in firefox and safari.

它在 Firefox 和 safari 中运行良好。

How can i do this in chrome and in other browser ?

我如何在 chrome 和其他浏览器中执行此操作?

回答by thomasrutter

Security features built into all browsers ensure that Javascript cannot interact with objects in other windows and/or frames if those Windows or frames were loaded from a different site. This is commonly known as the "same origin policy". Whether something was loaded from a different site is determined by the hostname part of the URL. If for example the outer frame is loaded from http://yoursite.comand the inner frame is loaded from http://example.comthen Javascript running in the scope of the outer frame will not be able to access or modify any properties or objects within the scope of the inner frame.

所有浏览器中内置的安全功能可确保 Javascript 无法与其他窗口和/或框架中的对象交互,如果这些 Windows 或框架是从不同站点加载的。这就是俗称的“同源策略”。是否从其他站点加载了某些内容由 URL 的主机名部分确定。例如,如果从外部框架加载http://yoursite.com并从内部框架加载,http://example.com那么在外部框架范围内运行的 Javascript 将无法访问或修改内部框架范围内的任何属性或对象。

In this case the specific error is indicating that your Javascript, which is running in the context of the outer frame, is denied from accessing an object (contentDocument) whose scope is the inner frame. Hidden somewhere in the jQuery you are trying to use will be an implicit access to the frame's documentelement (as accessed by the contentDocument property of that iframe).

在这种情况下,特定错误表明您在外部框架的上下文中运行的 Javascript 被拒绝访问其范围是内部框架的对象 (contentDocument)。隐藏在您尝试使用的 jQuery 中的某处将是对框架文档元素的隐式访问(由该 iframe 的 contentDocument 属性访问)。

You may be able to work around this by destroying the iframe and re-creating a new iframe with the desired src.

您可以通过销毁 iframe 并使用所需的 src 重新创建新 iframe 来解决此问题。