如何开发可在当前标签页跳转运行预定义链接的Chrome扩展

以下方案基于Chrome官方推荐的Manifest V3版本编写：

1. 配置manifest.json基础信息和权限 #

根据你的触发场景选择对应的权限配置：

• 点击扩展图标/按下快捷键触发跳转：仅需申请activeTab权限即可，无需额外敏感权限
• 后台自动触发跳转（如满足特定规则时自动跳转）：需要申请tabs权限

基础配置示例：

{
  "manifest_version": 3,
  "name": "快速跳转工具",
  "version": "1.0",
  "permissions": ["activeTab"],
  "action": {},
  "background": {
    "service_worker": "service-worker.js"
  }
}

2. 核心跳转逻辑实现 #

Chrome提供了原生chrome.tabs.updateAPI直接修改标签页的指向链接，无需向页面注入脚本。

场景1：点击扩展图标直接触发跳转 #

在service-worker.js中写入以下代码即可，修改PREDEFINED_URL为你的目标链接：

// 替换为你的预定义跳转链接
const PREDEFINED_URL = "https://example.com/target-page"

chrome.action.onClicked.addListener(async (currentTab) => {
  // 传入当前激活标签页ID，更新其URL为预定义链接
  await chrome.tabs.update(currentTab.id, {
    url: PREDEFINED_URL
  })
})

场景2：点击扩展弹窗内的按钮触发跳转 #

如果你的扩展有弹窗页面，在弹窗对应的JS文件中直接调用API即可，无需额外传入标签页ID，默认对应当前激活的标签页：

const PREDEFINED_URL = "https://example.com/target-page"
// 绑定弹窗内按钮的点击事件
document.querySelector("#jump-btn").addEventListener("click", async () => {
  await chrome.tabs.update({url: PREDEFINED_URL})
  // 跳转后自动关闭弹窗
  window.close()
})

常见注意事项 #

• 如果需要跳转至扩展内部页面（如chrome-extension://<扩展ID>/local-page.html），直接写入路径即可，无需额外权限
• 无用户交互的自动跳转场景不要使用activeTab权限，该权限仅在用户主动触发扩展操作时生效，自动触发场景需替换为tabs权限
• Manifest V2版本逻辑基本一致，仅需把配置中的action字段替换为browser_action，后台逻辑从service worker改为background scripts即可

内容的提问来源于stack exchange，提问作者Stephan Yazvinski