使用没有会话或 cookie 数据的 iFrame（隐身）答案

【问题标题】：Use an iFrame without session or cookie data (incognito)使用没有会话或 cookie 数据的 iFrame（隐身）
【发布时间】：2013-09-09 14:43:27
【问题描述】：

如果您在 HTML 文档中使用 iFrame 元素，则子页面将加载来自浏览器的所有会话和 cookie 数据。

例如：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Stack Overflow in an iFrame</title>
  </head>
  <body>
    <h1>Stack Overflow in an iFrame</h1>
    <iframe src="http://stackoverflow.com" width="640" height="480" />
  </body>
</html>

暂时忽略 SO 实际上不允许将自己加载到 iFrame 中。如果是这样，iFrame 加载的 SO 页面将显示您已登录。

如何在没有任何 cookie 或会话数据的情况下使用 iFrame？（如 Chrome 中的隐身模式）

为什么？

我的公司销售一种产品（网络应用），供人们用来构建定制网站。当他们通过身份验证并访问他们的网站时，我们会向他们展示经过身份验证的 UI 版本，以便他们可以编辑内容。未经授权的用户只能看到静态网站。使用多个浏览器或清除 cookie 不是我们用户的合理期望，因此我们希望在 iFrame 中向他们显示他们网站的预览，以便他们可以看到访问者会看到什么。我们还希望显示具有较小分辨率 iFrame 的网站的“移动”预览，以便他们可以看到访问者通过手机访问网站时会看到什么。这些 iFrame 需要在不访问浏览器的 cookie 或会话数据的情况下加载，以便它们在未经身份验证的模式下加载，就像 Chrome 在隐身模式下一样。

我还没有尝试过任何事情，因为我不知道从哪里开始。我确实发现了HTML5 added some sandbox attribute values to the iFrame element，但他们似乎都没有帮助解决这个问题。也许可以用 JavaScript 做一些事情，我们已经在我们的项目中使用了 jQuery。

注意：我们的目标是只使用有效的 HTML5

【问题讨论】：

您可以不控制来自客户端的 cookie 访问。我的公司还在 iFrame 中做了很多事情，所以在 iFrame 中设置 cookie/会话是我以前使用过的东西。您可能可以使用不同的子域，这将是最简单的。

标签： javascript html session iframe cookies

【解决方案1】：

如果您完全控制 webstack，添加一个将用户视为未经身份验证的预览参数不是更容易吗？

例如：

<iframe src="http://stackoverflow.com?preview=1" width="640" height="480" />

如果预览标志存在，则绕过您的授权检查。

【讨论】：

我认为这听起来是个好主意，您可以轻松地采用相同的方法来选择提供移动版本，就像问题提到的那样。
老实说，我们已经在使用 URL 参数的 auth'ed 模式中有一个“预览”模式，但它在顶部显示了一个 40 像素的栏，上面写着“这是一个预览您的网站”，它有一个返回编辑模式的按钮。我们不想在预览 iFrame 中显示这个顶栏；我们想要的正是最终用户所看到的。话虽如此，听起来控制 cookie 是不可能的，所以我将不得不添加某种方式来访问没有顶部栏的预览模式。谢谢！