iOS设备点击返回按钮页面不刷新，求专属JavaScript解决方案

iOS Safari的**Back-Forward Cache（BFCache）**机制会缓存页面状态，点击返回按钮时会直接从缓存加载页面，不会触发常规的页面刷新，这就是它和PC/Android行为不一致的核心原因。以下是针对性的解决方法：

核心解决方案：监听pageshow事件 #

在需要刷新的目标页面（即后退后到达的页面）添加以下代码，当页面从BFCache中恢复时自动刷新：

window.addEventListener('pageshow', function(event) {
  // 判断页面是否来自缓存
  if (event.persisted) {
    window.location.reload();
  }
});

修正自定义返回按钮的逻辑 #

你当前的代码存在逻辑错误：先执行刷新再后退，会导致刷新操作被后退中断，且无法作用到后退后的页面。应修改为仅执行后退操作，让目标页面通过pageshow事件自行刷新：

document.addEventListener("DOMContentLoaded", function() {
  var goBackButton = document.getElementById("goBackButton");
  if (goBackButton) {
    // 统一处理点击和触摸事件，仅执行后退
    goBackButton.addEventListener("click", function() {
      window.history.back();
    });
    goBackButton.addEventListener("touchstart", function() {
      window.history.back();
    });
  }
});

原理说明 #

• pageshow事件在页面显示时触发，包括从缓存加载的场景
• event.persisted属性为true时，表示页面是从BFCache中恢复的，此时执行reload()即可强制刷新页面获取最新数据

内容的提问来源于stack exchange，提问作者chem.engr