页面生命周期结束后如何执行一段代码?

Question

场景是非 SPA 页面, example.com/B是由 example.com/A 跳转的, 现在需要在 B 页面返回后刷新 A:

function backAndReload() {
  history.back()
  location.reload()
}

明显在 back() 之后页面被杀死, 后面的代码不会被执行, 所以使用 setTimeout 试下:

function backAndReload() {
  setTimeout(() => {
    location.reload()
  }, 1000)
  history.back()
}

但页面被杀死后, 注册的 timer 也会被杀死, 所以也不会被执行 reload.

那么问题来了, 应该使用什么方法可以在页面结束后可以执行一段代码?

Answer 1

如果不是在 SPA 里 的确没有合适的方法, 尝试过使用 web workers 包括 SharedWorker, 当页面杀死 js 进程就会结束, 没有逃脱的可能, 更何况 SharedWorker 在 webkit 下不被支持, 也没有相应的 ployfill.

Answer 2

在路由钩子中执行呢

Answer 3

可考虑 A 轮询 B，B 无响应后执行关闭代码。

Answer 4

B 页面使用一个信号量，存储方式可以是 cookie 或者 local storage，A 页面在加载时检查信号量是否存在来进行相应动作