Question

当浏览器失去对移动设备的关注时，通常设备会停止加载页面的JavaScript执行，但保留页面。

当用户稍后返回页面时，浏览器会显示之前加载的页面。

当使用SignalR时，活动浏览器可以接受来自服务器的推送消息，并且当移动设备运行JavaScript时，这非常有效，但是，当页面暂停时（由于浏览器变为非活动状态）推送通知是不再收到该页面。

这意味着当我返回到处于非活动状态的页面时，它已过期。它已经错过了来自服务器的一些通知。

鉴于来自服务器的消息是非连续的并且可能包含所有方式的更新数据，似乎最好的方法是在重新激活浏览器时强制刷新页面。

如何检测页面重新激活以触发刷新？

Answer 1

我还没有使用过SignalR，但我希望任何一个JS客户端都有一个"reconnect" event的回调方法。那就是你要强制刷新的地方。这样，只要移动客户端丢失并重新获得连接，它也会刷新所有数据。

如果无法选择重新连接事件，您可以尝试使用Page Visibility API确定标签何时重新获得可见性并强制刷新。

试试这个（Fiddle link for mobile）：

＆＃13;

function handleVisibilityChange() {
  if (document.hidden) {
    logMessage('Document hidden.');
  } else {
    logMessage('Document visible. Trigger refresh.');
  }
}

function logMessage(message) {
  var d = new Date();
  var timestamp = d.getHours() + ':' + d.getMinutes() + ':' + d.getSeconds();
  var p = document.createElement('p');
  p.innerText = timestamp + ' - ' + message;
  document.body.appendChild(p);
}

document.addEventListener("visibilitychange", handleVisibilityChange);

logMessage('Document is ' + document.visibilityState + '. Try minimizing the browser or changing tabs.');

＆＃13;

如何检测移动浏览器何时返回已暂停的页面？

1 个答案: