Question

我正在创建一个包含三个部分的单页Web应用程序：

标题
用于导航的侧边栏
用于显示主页内容的i框架

在第一页加载后，标头和侧边栏将永远不会重新加载-仅在i框架中。我正在使用History API（即pushstate）来处理历史记录和导航。

我遇到的问题是，如果有人直接在网站中的任何页面上键入url，我想加载标题和侧边栏，然后将其访问的页面加载到i框架中。如果他们已经在页面上并单击指向其他页面的链接，我只希望它在i框架中加载新页面。我希望这样做也不会弄乱导航历史。

我该如何检测并适当加载内容？

Answer 1

在iframe中，您将使用一小段Javascript来查看window.parent和window.top，如下所示：

iframe中的Javascript

if (window.parent == window.top) {
  // user loaded the iframe, go to parent 
  window.location = "<your parent url>" + "?iframe=" + window.location;
}

然后在父级中加载$_GET['inframe']所指示的iframe：

父级中的PHP

if (isset($_GET['inframe']) {
   loadIframe($_GET['inframe']);
}

我组成了一个loadIframe()函数，因为您没有提供任何代码，所以您必须用自己的代码替换。

出于安全原因，您可能希望使用filter_input()过滤输入：

父级中的PHP

if (isset($_GET['inframe']) {
   loadIframe(filter_input(INPUT_GET, 'inframe'], FILTER_VALIDATE_URL);
}

并执行进一步检查。这样一来，您可以防止人们使用iframe参数向您的代码中注入恶意内容，或仅加载他们所希望的任何iframe。

您可以使用AJAX代替iframe加载内容，并完全避免此问题。但是，iframe允许采用更传统的方式来加载内容。

如何检测外框是否已在单页应用程序中加载？

1 个答案: