Question

我有这个iframe在FF上工作正常，但它似乎没有在谷歌Chrome上加载。

有人能告诉我为什么会这样吗？

我的iframe ：

<iframe src="http://tripsketch.com/page?s=TheCavendish#!Id=1024&Name=London&Type=City&view=Attraction" height="700" width="990" frameborder="0" scrolling="no">
</iframe>

Answer 1

我对它进行了测试，并且在我的结尾处可以正常使用chrome。我的猜测是你已经设置好了，所以通过https访问包含iframe的页面。如果页面为https，则无法在该页面上加载非https的iframe。它将导致“混合内容错误”，出于安全考虑，它将无法加载。

它可以在FF中运行，因为FF对此安全限制更加宽松，Chrome在混合内容错误方面更加严格。

Answer 2

问题出在Chrome版本27.xx＆amp; 28.xxx 在这个版本中，chrome发出了url重定向，给出了空结果（302错误）。

Answer 3

为可能像我一样挣扎的人添加解决方案。我通过添加内容安全策略选项解决了该问题。

<httpProtocol>
  <customHeaders>
    <add name="Content-Security-Policy" value="frame-ancestors https://www.<preferredwebsitedomain>.com" />
    <!-- Test this option as Chrome supports CSP now for Iframe opening-->
  </customHeaders>
</httpProtocol>

Answer 4

我有同样的问题，我不知道是什么，它认为是因为chrome出于安全性考虑，无论如何，我可以这样解决：

在您的html中：

<embed src='your_path' width='100%' height='100%'  type="application/pdf" />

Answer 5

最后，经过大量调查和搜索，以下代码解决了该问题：

<style type="text/css">
iframe {
  border: none;
  width: 100%;
  height: 500px;
}

@media (min-width: 1024px) {
  .content_viewport {
    border: 0px none;
    height: 900px;
width: 100%;
  }
}
@media (max-width: 1023px) {
  .content_viewport {
    border: 0px none;
    height: 900px;
width: 100%;  }
}
@media (min-width: 768px) {
  .content_viewport {
    border: 0px none;
    height: 900px;
width: 100%;  }
}
</style>
<div style=" overflow: hidden; margin: 15px auto; max-width: 880px;"><iframe class="content_viewport" scrolling="no" src="<Your URL>"></iframe>
<p>&nbsp;</p>
</div>

Google Chrome不允许IFRAME加载HTML文件

5 个答案: