ClearTimeout 在另一个选项卡中设置

Question

如何清除浏览器中另一个tab中设置的timeout？

我尝试在localStorage 中存储超时参考，但无法清除timeout

function setIdleTimeout() {
    var idleTimeout = setTimeout(function() {
        //autologout
    }, 20000);
    localStorage.setItem('idleTimeout', idleTimeout);
}

function clearIdleTimeout() {
    var idleTimeout = localStorage.getItem('idleTimeout');
    clearTimeout(idleTimeout);
    localStorage.setItem('idleTimeout', idleTimeout);
}

如果我在第二个选项卡中调用clearIdleTimeout()，它不会清除previous tab 中设置的timeout

Answer 1

tab"a"

var timeout, interval;

timeout = setTimeout(function() {
  alert(123) // this should not be called
  clearTimeout(timeout)
  timeout = null;
  clearInterval(interval);
  interval = null;
}, 20000);
localStorage.setItem("timeout", timeout);

interval = setInterval(function() {
  console.log("checking localStorage:", localStorage.getItem("timeout"));
  // if `!localStorage.getItem("timeout")` : `true` 
  // call `clearTimeout()` with `timeout` as paramter
  if (!localStorage.getItem("timeout")) {
    clearTimeout(timeout);
    timeout = null;
    alert("cleared");
    clearInterval(interval);
    interval = null;
  }
}, 100)

plnkrhttp://plnkr.co/edit/wttPFS5RLgCu5OnF05Z1?p=info

tab“b”

var t;
t = setTimeout(clearTabTimeout, 5000);

// clear `timeout` at `tab` "a"
function clearTabTimeout() {
  // remove `"timeout"` item from `localStorage`
  localStorage.removeItem("timeout");
  console.log(localStorage);
}

plnkrhttp://plnkr.co/edit/CgQqlVIUzUo7zeHCb2Ca?p=preview