如何使用React获取Google Chrome浏览器的当前页面URL

要获取Chrome浏览器当前活跃标签页的URL，你可以结合Chrome扩展的tabs API与React钩子实现，以下是可行的示例代码：

useEffect(() => {
  // eslint-disable-next-line no-undef
  chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
    setCurrentUrl(tabs[0].url);
  });
}, []);

说明 #

• 这段代码仅能在Chrome扩展环境中运行，且你的扩展需要在manifest.json文件中声明tabs权限。
• 借助React的useEffect钩子，确保组件挂载时仅执行一次查询逻辑，通过setCurrentUrl（需提前定义的状态更新函数）存储获取到的URL。

亲测上述代码可成功获取当前页面URL

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