7

Mobile Safari 使用一种特殊的缓存机制Page Cache（这里），它基本上保持当前页面处于活动状态，但当我们导航到另一个页面时会休眠。back这样，当用户按下按钮时，它可以立即以最新状态显示上一页。

这对于导航和浏览网页很有用，但对于特殊情况，这会变得很烦人，因为每次用户导航到该页面时，您可能需要获取该页面的新副本。（在我的情况下，我必须页面：登录和主页）。

我完全知道没有什么能阻止用户打开同一应用程序的多个选项卡。我对此并不担心。

防止页面被缓存的跨浏览器解决方案无济于事，因为 Safari 保持页面打开但不可见和暂停。

window.onpageshow和处理event.persisted没有帮助，因为浏览器似乎由于某些原因第二次（当您按下按钮时）没有执行onpageshow事件back。

对于那些不知道事件是什么的人请注意onpageshow：Apple 不鼓励使用load和unload事件，因为对于页面缓存的概念，这些事件没有明确的意义。所以，onpageshow应该做我们对load事件的期望。

4

2 回答 2

4

另一个可能的解决方案是查看event.persisted标志以确定它是否被缓存：

window.onpageshow = function(event) {
    if (event.persisted) {
        window.location.reload() 
    }
};
于 2015-07-22T16:00:09.483 回答
2

当用户按下后退按钮时，您将收到与之前相同的文档（被暂停的旧页面）。因此，如果您onpagehide在导航到新页面之前处理事件并对页面进行一些修改，您的更改将保留在那里。

我尝试body在导航之前添加一个脚本块：

if (isSafari) {
        window.addEventListener('pagehide', function(e) {
            var $body = $(document.body);
            $body.children().remove();
                $body.append("<script type='text/javascript'>window.location.reload();<\/script>");
        });
    }

这不起作用，因为当用户返回页面时，脚本会立即执行我打算执行它的地方。

但是如果你在离开pagehide回调后推迟你的 DOM 修改，（像这样）：

if (isSafari) {
        window.addEventListener('pagehide', function(e) {
            var $body = $(document.body);
            $body.children().remove();

            // wait for this callback to finish executing and then...
            setTimeout(function() {
                $body.append("<script type='text/javascript'>window.location.reload();<\/script>");
            });
        });
    }

多田它有效！一旦用户按下下一页上的返回按钮，Safari 就会加载暂停的页面并执行这个以前没有执行过的新脚本块。

于 2014-07-02T06:25:39.317 回答