如何防止在使用移动Safari浏览器时从缓存重新加载网页？ [英] How to prevent reloading of web page from cache while using mobile safari browser?

问题描述

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

Mobile Safari uses a special caching mechanism Page Cache (here) which basically keeps the current page alive but hibernated when we navigate to another page. This way, it can immediately display the previous page in its latest state when user presses back button.

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

This is useful for navigation and browsing web but for special cases this becomes annoying as you may need to get a fresh copy of the page each time user navigates to that page. (in my case I have to pages: login and main page).

我完全清楚没有什么能阻止用户打开同一个应用程序的多个标签。我并不担心。

I am totally aware that nothing prevents user from opening multiple tabs of the same application. I not concerned about that.

跨浏览器解决方案，以防止页面被缓存没有帮助，因为Safari保持页面打开但不可见和暂停。

The cross browser solution for preventing page from being cached does not help as Safari is keeping the page open but invisible and suspended.

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

The window.onpageshow and handling event.persisted does not help as it seems that the browser does not execute onpageshow event for some reasons the second time (when you press back button).

注意对于那些不知道 onpageshow 事件的人：Apple不鼓励使用加载和卸载事件因为具有页面缓存的概念，这些事件没有明确的意义。所以， onpageshow 应该按照我们的预期从加载事件。

Note for those who do not know what onpageshow event is about: Apple discourages using load and unload events because with the concept of page cache those events does not make a clear sense. So, onpageshow is supposed to do what we expect from load event.

推荐答案

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

When user presses back button, you will receive the same document as you had before (the old page which was suspended). So if you handle onpagehide event and do some modification to the page just before navigating to the new page, your changes are kept there.

我尝试在导航之前将一个脚本块添加到正文：

I tried adding a script block to the body just before navigating:

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

这不起作用，因为脚本立即执行我的意图是当用户返回页面时执行它。

this does not work because the script immediately executes where my intention was to execute it when user returns back to the page.

但是如果你在离开<$ c $后推迟你的DOM修改c> pagehide 回调，（类似这样）：

BUT if you postpone your DOM modifications after leaving pagehide callback, (something like this):

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>");
            });
        });
    }

TADA 它有效！一旦用户按下下一页上的按钮，Safari就会加载暂停的页面并执行之前未执行的新脚本块。

TADA it works! as soon as user presses back button on the next page, Safari loads the suspended page and executes this new block of script which has not executed before.

这篇关于如何防止在使用移动Safari浏览器时从缓存重新加载网页？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！