IFrame documentContent中的SVG内容消失
问题描述： 当使用IFrame的documentContent属性时，SVG内容消失。
解答： IFrame是HTML中的一个元素，用于在网页中嵌入其他网页或者文档。documentContent属性可以用于获取或设置IFrame中的文档内容。然而，由于一些限制和安全策略，当IFrame的documentContent属性中包含SVG内容时，可能会出现SVG内容消失的情况。
这个问题通常是由于浏览器的安全策略引起的。浏览器在加载外部资源时，会根据安全策略来限制跨域资源的访问。如果SVG内容被加载到IFrame的documentContent中，并且SVG资源的域与IFrame的域不一致，浏览器会禁止跨域访问，导致SVG内容无法正常显示。
解决这个问题的方法有两种：
- 使用相同的域： 确保IFrame和SVG资源的域相同，这样就不会触发浏览器的跨域限制。可以将SVG资源放在与IFrame相同的域下，或者使用相对路径引用SVG资源。例如，将SVG资源和IFrame放在同一个域下：
<iframe src="https://example.com/iframe.html"></iframe>- 设置CSP策略： Content Security Policy（内容安全策略）可以用来指定允许加载的资源来源。通过设置CSP策略，可以解除浏览器对IFrame中跨域资源的限制。具体的设置方法取决于服务器端的配置，可以参考相关的文档进行配置。
总结： IFrame中的SVG内容消失可能是由于浏览器的安全策略导致的跨域问题。可以通过确保IFrame和SVG资源的域相同，或者设置CSP策略来解决这个问题。
腾讯云相关产品推荐： 腾讯云提供了多个与云计算相关的产品，例如云服务器（CVM）、云存储（COS）、云数据库（CDB）等。这些产品可以帮助用户搭建和管理云计算基础设施，并提供高可用性和可扩展性的解决方案。
具体关于腾讯云产品的介绍和详细信息，请参考以下链接：
相关·内容
我尝试在一个模态中复制特定IFrame元素中的内容，以避免不必要的DB调用。我通过Python (请参阅here)调用一个客户端回调函数，它返回我想要在我的模式中复制的特定IFrame元素的索引。以下是Python代码片段，用于切换我的模式并跟踪要复制的最近单击的图形的索引： @app.callback(
[Output
浏览 10提问于2020-07-29得票数 0
回答已采纳
内容以html的形式交付，其中可能包含“未保存的内容”。例如，iframes与youtube视频。我是这样输出的分量法 returnthis.domSanitizer.bypassSecurityTrustHtml(this.documentContent);挺管
浏览 0提问于2017-07-17得票数 6
回答已采纳
1回答
我使用javascript (使用chrome扩展)将iframe注入到网页上。使用javascript，我创建iframe，我可以访问html的url，所以我想我可以使用$.get获取DOM
console.log(container.documentContent);
浏览 0提问于2018-04-23得票数 3
回答已采纳
在我的应用程序中，我有两个主要的div :一个用于菜单(= treeview)，另一个用于显示.mht文件(#documentContent)。我的菜单调用一个javascript函数，该函数执行对viewdoc的ajax请求，并将viewdoc的输出放到我的内容div (#documentContent)中：
function loadDocumentid=' + id + '
浏览 1提问于2010-05-26得票数 1
回答已采纳
2回答
我正在尝试使用CSS对SVG元素进行样式化。我在我的index.js文件中使用iframe来引用我的SVG，SVG显示得很好。但是，我的CSS样式并不适用，因为如果我只是将SVG内容复制/粘贴到我的index.js中，它就不会适用了。内容存储在对象#文档下。如何使用CSS引用iframe内容？
浏览 14提问于2022-01-17得票数 0
有许多关于消失的iFrame内容的帖子，但我能找到的是关于立即消失，或随机消失的内容。当您将一个URL加载到iframe中，然后在其他选项卡中播放一段时间(在同一个浏览器中)时，就会出现这个问题。消失不是即时-快速切换之间的几个标签，然后
浏览 4提问于2016-06-29得票数 19
我正在尝试通过JavaScript访问SVG的contentDocument (并更改特定路径的填充颜色，但这一点我没有问题)。SVG来自用户输入。每当我尝试访问contentDocument时，我都会得到错误：
(索引)：41 Uncaught :未能从‘HTMLObjectElement’中读取'contentDocument‘属性:阻止具有源"“的帧访问跨源帧。如您所见，我正在使用本地服务器，但在本地访问文件时，结果是相同的。"ch
浏览 3提问于2016-11-15得票数 0
回答已采纳
我尝试过使用embed、object和iframe，它们是从TinyMCE或CodeMirror编辑器中输入的。我正在打开html视图，并直接将类似以下内容添加到页面中：type="image/svg+xml"
pluginspage当我“保存”时，两个编辑器都会默默地删除我<em
浏览 5提问于2011-06-17得票数 0
回答已采纳
2回答
我正在尝试为Gate中的特定注释设置内容。有一些方法可以提取文档中给定注释的内容/文本。我想要更改给定注释所显示的文本，这意味着最终它应该更改文档的实际文本。门中是否可以更改注释的内容？gate.Utils.stringFor(document，注释)或contentFor方法给出由给定注释突出显示的文本。COuld没有找到任何将设置内容的</e
浏览 5提问于2016-08-11得票数 2
2回答
我问的是关于生产者服务的REST合同。因此，考虑一个例子。我有一个服务，允许将用户数据以不同的格式存储到数据库中，并充当服务和数据库之间的代理。它有所有消费者都需要的参数，以及依赖于消费者的参数。{ "name": "Levi Strauss", }
} 正如你所看到的，documentCon
浏览 10提问于2020-06-23得票数 0
在我的项目中，我必须连接到现有的数据库，并执行更新两个表的逻辑。我的设置如下：@Table(name = "DOCUMENTCONTENT")public class DocumentContent {
}当我从上面的服务激发方法时，我可以注意到控制台输出中的SQL：
Hibernate:更新文档内容集content=？我理解为什么jpa在文档内容</
浏览 0提问于2018-10-10得票数 0
回答已采纳
1回答
据我所知，通过使用<foreignObject />标记可以在SVG中添加HTML。我想通过使用iframe内部SVG加载一个页面，但是它不能工作。我漏掉了什么吗？还是不能使用HTML内部SVG？这是我的密码： <foreignObject x="0&qu
浏览 2提问于2014-10-01得票数 3
回答已采纳
我试着移动它，但是iframe内容消失了。但它不起作用:)如何在不丢失内容的情况下将该死的iframe移动到文档中的另一个位置？^_^
浏览 0提问于2010-05-22得票数 6
回答已采纳
1回答
CSS悬停视频
、、
我有一个问题，我的css悬停iframe的视频，我希望当光标悬停时，效果消失，如果你看到我的代码，悬停效果是工作的，但当你点击播放按钮视频播放过滤器，直到你把光标悬停。我想播放没有效果的视频，而不需要将光标放在上面。谢谢iframe { filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http:/
浏览 1提问于2017-09-28得票数 0
1回答
我正在生成一个iframe，并用一个div和一个d3脚本填充它，以便在其中呈现svg内容。类似于：
<iframe id="content-frame""> <head></head> <body> <div id="target"></div></script> </body> <
浏览 0提问于2015-02-04得票数 1
我试图创建动态SVG图形，我的理解是创建动态SVG的唯一方法是使用脚本语言，所以我有几个问题，基本上我想将SVG加载或嵌入到HTML页面，并使用网页中的输入来控制图形，而不是硬编码SVG文件中的ECMAscript我不完全确定是否应该使用embed标记或iframe来显示SVG，以下是我对SVG和脚本的怀疑：
使用<iframe
浏览 23提问于2011-04-17得票数 7
回答已采纳
1回答
使图表的大小调整到其外部容器
、、、、
我想在我的网页中嵌入。这是一个工作的。
目前，SVG的大小是由<svg width="960" height="600"></svg>确定的。如果我们将它更改为例如，<svg width="200" height="200"></svg>，我们将看到地图部分显示，而地图<
浏览 4提问于2017-09-05得票数 0
我是SVG的新手，也不是JavaScript的高级用户。我有一个用javascript动态呈现svg内容的网页。在Internet Explorer中，当我右键单击svg内容时，我会看到“将图片另存为”选项，并且我可以将内容保存为png或svg。我如何通过编程来做到这一点，有一个按钮，并允许用户保存在png的内容到他们的机器上。
浏览 0提问于2011-12-05得票数 13
回答已采纳
我在一个页面上有两个可编辑的文本网页部件。一个web部件在其上设置了默认文本，因为大部分时间它将是相同的文本。但是，它永远看不到，所以它不会成功地在另一个the部件中拾取文本所以我想，也许我需要调用GetContent()来获得用户提供的可编辑区域<
浏览 9提问于2017-08-02得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
云直播活动推荐
腾讯云开发者
