嵌入页面的不同方法
Posted
技术标签:
【中文标题】嵌入页面的不同方法【英文标题】：Different methods of embedding a page 【发布时间】：2014-12-02 02:01:45 【问题描述】：我们为客户提供第三方网站。当我们处理 RFP 时，我们经常被问到是否可以将我们的网站嵌入到客户的网站中。我们的许多潜在客户都有不寻常的限制或要求，例如“不要使用 iframe”。
为此，我被要求确保我们即将重新设计的网站能够以至少两种方式嵌入到客户的网站中。
将功能齐全的网站（与跨站点图像或静态内容相对）嵌入另一个网站的方法如下：
iframe - 被广泛使用，经常被诽谤，以及我们的一些 以前的 RFP 已经明确排除了这种可能性。
Object/Embed tags - 回到过去，可以嵌入 以与嵌入相同的方式将功能齐全的 html 页面放入另一个页面 一个 Flash 对象。
Ajax - 据说能够加载一个完整的
将站点转换为 HTML 对象（例如 div 标记），但由于跨域请求的危险，似乎需要跳过额外的安全环。
是否有其他方法可以将完整站点放置在来自不同域的另一个站点中？以上三个是否有任何警告或限制（例如，我们的网站使用 AJAX 调用登录并更新一些用户定义的设置，这些在上述每个嵌入策略中都能正常运行吗？）我可能是不知道？
提前致谢。
【问题讨论】：
【参考方案1】：
X-Frame-Options响应头
如果您将您的 网站嵌入到其他人的网站，您必须小心X-Frame-Options response header。确保您的站点不发送SAMEORIGIN 作为X-Frame-Options 的值。如果这样做，将会给iframes and embedded objects 带来问题。你可以做两件事：
您绝对不要发送标头：任何网站都可以在 iframe 中或作为嵌入对象显示您的网站。这可能会导致像clickjacking 这样的安全问题。 请参阅this article 了解有关点击劫持的更多信息和防御。
您可以确保只有您授权的站点才能嵌入您的站点：这是通过为 X-Frame-Options 标头发送 ALLOW-FROM url 值来完成的。您可以嗅探HTTP-referer 以确定哪个站点正在请求您的页面。这比选项 1 确实安全（当然，除非用户的浏览器是恶意的）。 注意：并非所有浏览器都支持ALLOW_FROM。请参阅linked reference 了解支持的浏览器
同源策略
Same Origin Policy 不会影响您，只要您的站点和您的客户站点不访问彼此的 DOM。
CORS
如果来自您客户网站的脚本向您网站中的资源发出 AJAX 请求 (XmlHttpRequest)，则应考虑使用Cross-Origin Resource Sharing。但就你的问题而言，我认为情况并非如此。
I gave an answer explaining CORS some time back，如果你想对CORS有一个基本的了解，可以阅读它。
第三方网站插件
您似乎正试图在客户网站中嵌入一些功能。考虑提供像Facebook 和Disqus 这样的网站插件。
我不确定同源政策或 CORS 是否适用于此。我会找出来并回复你。
注意： X-Frame-Options，同源策略和 CORS 由浏览器实现。如果用户的浏览器没有实现这些功能，或者如果浏览器被黑客入侵以不遵守这些安全政策，您将无能为力。
【讨论】：
以上是关于嵌入页面的不同方法的主要内容，如果未能解决你的问题，请参考以下文章