访问扩展的 background.js 的控制台和开发工具 [英] Accessing console and devtools of extension's background.js

问题描述

我刚开始使用 Google Chrome 扩展程序，但似乎无法从后台 js 登录到控制台.当发生错误时(例如，由于语法错误)，我也找不到任何错误消息.

I just started out with Google Chrome extensions and I can't seem to log to console from my background js. When an error occurs (because of a syntax error, for example), I can't find any error messages either.

我的清单文件:

{
  "name": "My First Extension",
  "version": "1.0",
  "manifest_version": 2,
  "description": "The first extension that I made.",
  "browser_action": {
    "default_icon": "icon.png"
  },
  "background": {
    "scripts": ["background.js"]
  },
  "permissions": [
    "pageCapture",
    "tabs"
  ]
}

background.js:

background.js:

alert("here");
console.log("Hello, world!")

当我加载扩展时，警报出现，但我没有看到任何记录到控制台.我做错了什么?

When I load the extension, the alert comes up but I don't see anything being logged to console. What am I doing wrong?

推荐答案

你看错地方了.这些控制台消息不会出现在网页中，而是出现在不可见的后台页面 (ManifestV2) 或 service worker (ManifestV3) 中.

You're looking at the wrong place. These console messages do not appear in the web page, but in the invisible background page (ManifestV2) or service worker (ManifestV3).

要查看后台脚本上下文的正确控制台打开 devtools:

To view the correct console open devtools for the background script's context:

1. 访问 chrome://extensions/ 或右键单击扩展程序图标并选择管理扩展程序".
2. 启用开发者模式
3. 点击名为 background page (ManifestV2) 或 service worker (ManifestV3) 的链接.

1. Visit chrome://extensions/ or right-click the extension icon and select "Manage extensions".
2. Enable developer mode
3. Click on the link named background page (ManifestV2) or service worker (ManifestV3).

ManifestV2 扩展的屏幕截图:

Screenshot for ManifestV2 extensions:

ManifestV3 扩展的屏幕截图:

Screenshot for ManifestV3 extensions:

这篇关于访问扩展的 background.js 的控制台和开发工具的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！