解决Android返回页面不刷新问题

• 表现：嵌入Android手机中的H5页面上，使用history.back或者history.go返回上一个页面时，页面并不会刷新

• 原因：页面A跳转到B时，页面A进入BFCache模式，页面是hidden状态，并销毁；从页面B返回时，直接从BFCache获得页面并显示

• 解决: 找到页面重现时机，手动触发页面状态的更新，那么页面何时重现呢？pageshow事件

    const handleReappear = (event) => {
      const { performance } = window
      const { navigation } = performance || {}
      const { type } = navigation || {}
    
      const historyTraversal = event.persisted || type === 2
    
      if (historyTraversal) {
        window.location.reload()
      }
    }
    
    window.addEventListener('pageshow', handleReappear)

参考文献：

当浏览器返回键点击后如何强制刷新页面

Performance.navigation

Performance.navigation.type

BFCache

pageshow & pagehide （ webkit.org/blog/516/we… developer.mozilla.org/en-US/docs/… developer.mozilla.org/en-US/docs/…

页面返回时，如何刷新页面