导航后退/卸载事件未触发时,iOS 5 Safari中的页面缓存问题

Cla*_*rke 18 javascript mobile-safari browser-cache ios5 web

tl; dr - iOS 5上的Safari缓存非常困难,它打破了我的网站.

我正在努力解决iOS 5中的Safari浏览器处理后向缓存的问题,他们称之为"页面缓存".这里描述的方式非常好地解释了这种行为.

很简单,页面缓存使得当你离开页面时我们"暂停"它,当你回来时我们按下"播放".

这会导致整个网站出现问题.使用后退按钮时,大多数其他浏览器会以加载状态显示页面.不是iOS 5上的Safari,它会显示您上次离开时​​的页面.一个简单的例子是禁用提交按钮.如果我使用Javascript来禁用提交按钮,然后提交表单,当您单击后面的提交按钮仍将被禁用.这在其他浏览器中是一个问题,包括Safari的桌面版本,但是通过将onload事件处理程序设置为空函数来解决它.我相信这告诉浏览器使缓存无效,因为在该函数中可能发生了一些重要的事情.这个hack似乎不适用于iOS 5上的Safari.

以下是问题归结为最基本的问题.加载test.html时,您将看到文本"原始文本".当您单击该链接时,该文本将更改为"更改文本 - 转发到下一页",然后在3秒内您将转发到test2.html.在所有浏览器中,一切都很好.在所有其他浏览器中,当您单击后退按钮时,您将看到的文本是"原始文本",但在Safari for iOS 5上,您将看到"更改文本 - 转发到下一页".

有关如何处理这个的任何建议?

这是一个简单的例子

的test.html

<script>
function changeText() {
    el = document.getElementById("text");
    el.innerHTML = "Changed text - forwarding to next page";
    setTimeout("forward()",3000);       
}
function forward() {
    document.location.href = "test2.html";
}
</script>
<div id="text">Original Text</div>
<a href="Javascript:changeText()">Click Here</a>
<script>
window.onunload = function(){};
</script>
Run Code Online (Sandbox Code Playgroud)

test2.html

<div>Click back button</div>
Run Code Online (Sandbox Code Playgroud)

这是使用表单的第二个示例.这是我的应用程序如何工作的一个简单示例.当您导航回formtest2.asp时,您应该看到已发布的表单值,div文本应该是原始的.

formtest.asp

<form method="post" action="formtest2.asp">
    Test: <input type="text" name="test"/>
    <input type="submit" value="Submit"/>
</form>
Run Code Online (Sandbox Code Playgroud)

formtest2.asp

<script>
function changeText() {
    el = document.getElementById("text");
    el.innerHTML = "Changed text - forwarding to next page";
    setTimeout("forward()",3000);       
}
function forward() {
    document.location.href = "test2.html";
}
</script>

<%
Dim test
test = Request("test")
Response.Write("Test value: " & test & "<br />")
%>

<div id="text">Original Text</div>
<a href="Javascript:changeText()">Click Here</a>
<script>
window.onunload = function(){};
</script>
Run Code Online (Sandbox Code Playgroud)

test2.html

<div>Click back button</div>
Run Code Online (Sandbox Code Playgroud)

Bru*_*Dev 26

我也在寻找同一问题的答案.回到iOS 5中不执行任何javascript,只是让页面处于您离开或被重定向时的先前状态.

尝试在" 单击后退按钮时是否存在跨浏览器onload事件? "中发现的奇怪的"onunload"黑客攻击仅适用于iOS 4,而不适用于未按预期调用事件的iOS 5.Nickolay在Web工具包上指出了名为"pageshow"和"pagehide"的新功能,它们比Giuseppe的例子更可靠.

  1. 您需要本文中的hack:" 单击后退按钮时是否存在跨浏览器onload事件? "这样才能在iOS 4中运行.
  2. 使用此脚本使用新事件来安全地检查页面是否已从缓存加载并强制重新加载(避免URL检查和本地存储以及包括iPod)以用于iOS 5:

    <body onunload="">
    ...
    <script type="text/javascript">
    if ((/iphone|ipod|ipad.*os 5/gi).test(navigator.appVersion)) {
      window.onpageshow = function(evt) {
        // If persisted then it is in the page cache, force a reload of the page.
        if (evt.persisted) {
          document.body.style.display = "none";
          location.reload();
        }
      };
    }
    </script>
    
    Run Code Online (Sandbox Code Playgroud)


Elf*_*dae 1

我遇到了同样的问题。
在iOS4上,当您导航homepage.html到2.html,然后返回homepage.html时,js将不会被调用。当你导航homepage.html到2.html,从2.html继续转到3.html,然后从3回到2回到首页,JS就会被调用!是的,太可怕了!
但是在iOS5 MobileSafari上,它总是无法调用:(也许这是iOS5上的缓存错误。我在iOS 5.0.0和5.0.1上进行了测试,得到了相同的结果。

但是当你在元素上实现 onUnload 事件时body,它可以解决以前 MobileSafari 上的后退问题。我只是将homepage.html中的改为<body><body onUnload="">然后从homepage更改为2.html,当返回主页时,主页上的javascript将被调用。它适用于 FF、桌面 Safari、移动 Safari( iOS4 )

那么,在iOS5上我们该怎么办呢?不幸的是我还没有找到解决方案。但我的 web 应用程序在本机客户端中运行,我通过添加reload()来自本机的调用来修复此问题:

        如果(isOS5_)
        {
            [webView stringByEvaluatingJavaScriptFromString:@"location.reload();"];
        }

什么时候webViewDidFinishLoad: