可以在 iFrame 中显示 HTTPS 内容吗？

Posted 2023-03-13

【中文标题】可以在 iFrame 中显示 HTTPS 内容吗？

【英文标题】：Possible to show HTTPS content in iFrame?

【发布时间】：2015-11-05 22:29:00

【问题描述】：

我们正在尝试将此 Reddit 页面 (https://www.reddit.com/live/veh2e41lp0he) 嵌入 iFrame，但它显示为空白。我们认为将实时聊天分层放在页面顶部会很整洁，但如果不求助于扩展程序或强制用户下载某些东西，这似乎是不可能的。

这是 HTTP JSFiddle：http://jsfiddle.net/sjvcs165/，它适用于 CNN.com 和 ESPN.com。

<iframe src="https://www.reddit.com/"></iframe>

html 
    height: 100%;

body  
    height: 100%; 
    min-height: 100%;
    position: relative;


iframe  width: 100%; height: 100%; min-height: 100%; 

这里是 HTTPS JSFiddle：https://jsfiddle.net/zzkpdxue/，它包含相同的代码，但源自一个 HTTPS 页面，我们认为这可以解决问题。它也无法显示 HTTPS 内容。

不能在 iFrame 中显示 HTTPS 内容吗？作为安全内容呈现的广告不是有时通过 iFrame 在 HTTPS 页面上投放吗？

【问题讨论】：

在 Chrome 中打开浏览器控制台 (F12)，您的小提琴状态“拒绝在框架中显示 'youtube.com'，因为它将 'X-Frame-Options' 设置为 'SAMEORIGIN'” - Youtube 选择屏蔽 iFrame

@TemporalSlide Lol 正是我要说的。我只是在答案中输入它哈哈

***.com/questions/18136803/… 的副本，有一个可能的解决方法（不确定是否适合您，但看起来可能）。看起来与另一个重复的***.com/questions/9934944/… 的解决方案相同。那里还有很多其他人，即使是粗略的搜索也会为您显示这一点。如果您想了解更多原因，我也发现这很有趣：coderissues.com/questions/20346576/same-origin-policy

@DanielBrose 谢谢。实际上这个问题还不清楚，因为我们的主要用例是 Reddit，而不是 YouTube。我们首先在网上搜索了与“https 内容 iframe”相关的概念。如果它只是 YouTube，您可能是对的，我们会找到它。希望人们不会在不问更多问题的情况下这么快就投反对票（不是说你这样做了）。

@Crashalot - 你被否决的原因与你从未提及错误消息的方式更相关。这比其他任何事情都表明在跳到这里提问之前缺乏适当的研究工作或故障排除，因为这是一个基本步骤（在所有 JS 答案或 cmets 的 90% 中重复）并且会导致非常容易的答案搜索.如果（如***.com/help/how-to-ask 中所述）您包含指向 DIDNT 帮助您的帖子的链接以显示研究工作，则可以避免此问题。这个问题重复了很多次，你需要它。

【参考方案1】：

如果您打开您的开发者工具（Chrome 或 FF），您会看到一个错误：

Refused to display 'https://www.youtube.com/' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'. Refused to display 'https://www.reddit.com/live/veh2e41lp0he' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'

如果您在此处on *** 进一步查看此内容，您会看到有一个标题阻止 iframe 加载。

基本上其他网站（Youtube 或 Reddit）会阻止您从他们自己的网站以外的任何其他来源加载内容。要获取内容，您需要查看使用 AJAX 或 CURL 请求获取它。

【参考方案2】：

错误：

Refused to display 'https://www.reddit.com/live/veh2e41lp0he' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

Reson : reddit.com http header 'X-Frame-Options' 不允许从其他来源加载到 Iframe。

解决方案：使用 CURL 读取页面