网页掉线终结者：Token 永续只需一个插件！

还是先说实现

当你想为一个页面创建定时刷新的时候，可以在当前页面直接右键

想要关闭定时刷新，可以右键，或者直接关闭页面即可

前言：

想象一下，你正在浏览一个页面，突然来了点急事，离开了一会儿，回来后发现登录状态失效了！页面提示你 “Session 已过期，请重新登录。” 这是不是非常恼人？尤其是那些 Token、Cookie 或 Session 过期时间极短的网站，你甚至需要频繁刷新来保持活跃。

今天，我为你带来了终极解决方案——自动刷新插件 Auto Refresh Tabs，一款让你避免掉线尴尬的神器！

痛点描述：

为什么需要自动刷新？

1. Token 过期烦人：很多网站的 Token 过期时间很短，稍不注意就需要重新登录。
2. Session 状态丢失：长时间不操作页面，Session 就会掉线，导致重要的数据可能丢失。
3. 突发事件中断操作：正在工作或者查看页面内容，突然被其他事情打断，回来却发现必须重新验证或刷新页面。

这些问题不仅影响效率，还可能导致无谓的重复劳动！

插件的解决方案：

1. 定时刷新页面 通过插件，你可以为任意页面设置定时刷新间隔，避免因长时间不操作导致的掉线问题。设置非常简单，只需要右键点击并选择“定时刷新”，就能高枕无忧！
2. 灵活配置刷新间隔 插件支持 1 分钟、3 分钟、5 分钟等多种时间间隔，甚至可以根据需求自定义时间！你再也不用担心 Token 过期而措手不及。
3. 自动恢复失效的 Tab 如果某个页面意外关闭，插件还能帮你清理无效的刷新任务，保持资源整洁高效。

当你想为一个页面创建定时刷新的时候，可以在当前页面直接右键

想要关闭定时刷新，可以右键，或者直接关闭页面即可

image-20241227113402001

插件背后的原理

这款插件基于 Chrome 扩展的功能实现，使用了以下技术：

• ContextMenus：右键菜单的创建和动态更新。
• Alarms API：定时触发刷新任务，精准到毫秒。
• Tabs API：获取和操作浏览器的 Tab，支持自动清理无效页面。
• Storage API：存储用户选择的刷新间隔，确保个性化体验。

核心逻辑代码如下：

// 设置刷新任务
function setRefresh(tabId, interval) {
  refreshTabs[tabId] = interval;
  chrome.alarms.create(`refresh-${tabId}`, { periodInMinutes: interval / 60000 });
  console.log(`设置刷新：Tab ${tabId}, 每 ${interval / 1000} 秒刷新一次`);
}

// 清除刷新任务
function clearRefresh(tabId) {
  if (refreshTabs[tabId]) {
    delete refreshTabs[tabId];
    chrome.alarms.clear(`refresh-${tabId}`);
    console.log(`清除刷新：Tab ${tabId}`);
  }
}

// 定时触发刷新
chrome.alarms.onAlarm.addListener((alarm) => {
  const tabId = parseInt(alarm.name.replace("refresh-", ""), 10);
  chrome.tabs.reload(tabId, { bypassCache: true }, () => {
    console.log(`Tab ${tabId} 刷新成功`);
  });
});

安装与使用：

1. 将插件代码克隆到本地，加载到 Chrome 扩展中。
2. 在需要保持登录状态的页面，右键选择“定时刷新”，设置合适的时间间隔即可！
3. 插件支持多页面同时刷新，并在浏览器图标上显示当前任务数，随时了解刷新状态。

结尾：

使用 Auto Refresh Tabs 插件，从此告别掉线烦恼！无论是保持登录状态，还是确保 Session 不过期，它都能成为你的得力助手。赶快下载体验吧！

PS：再也不用手动点 F5 了，解放双手从这一刻开始！