浏览器长时间未操作执行

最新推荐文章于 2024-06-23 19:49:19 发布

qzhcode

最新推荐文章于 2024-06-23 19:49:19 发布

阅读量288

点赞数 1

文章标签：前端 javascript 开发语言

本文链接：https://blog.csdn.net/weixin_45880538/article/details/131779475

版权

浏览器长时间未操作执行 location.reload(), 循环进行

主要代码如下：

     let refreshTimer;
      function startRefreshTimer() {
        refreshTimer = setTimeout(refreshPage, 30 * 60 * 1000); // 30分钟后刷新页面
      }
      function resetRefreshTimer() {
        clearTimeout(refreshTimer);
        startRefreshTimer();
      }
      function refreshPage() {
        clearTimeout(refreshTimer);
        location.reload(); // 刷新页面
        // 重新启动定时器
        //resetRefreshTimer();
      }
      function handleUserInteraction() {
        resetRefreshTimer();
      }
      document.addEventListener("mousemove", handleUserInteraction);
      startRefreshTimer()

Vue2项目使用示例：

mounted() {
    this.noOpertion();
  },
  methods: {
    noOpertion() {
      let refreshTimer;
      function startRefreshTimer() {
        refreshTimer = setTimeout(refreshPage, 30 * 60 * 1000); // 30分钟后刷新页面
      }
      function resetRefreshTimer() {
        clearTimeout(refreshTimer);
        startRefreshTimer();
      }
      function refreshPage() {
        clearTimeout(refreshTimer);
        location.reload(); // 刷新页面
        // 重新启动定时器
        //resetRefreshTimer();
      }
      function handleUserInteraction() {
        resetRefreshTimer();
      }
      document.addEventListener("mousemove", handleUserInteraction);
      startRefreshTimer()
    }
  },