如何获取chrome扩展的调试信息

Question

我编写了一个DOM树保护程序Chrome扩展程序来检查DOM树是否发生了变化。我在background_page中有js文件，如何在其他测试html文件中获取那些console.logs（）？我现在只能找到chrome：// extensions /当我点击generated_background_page.html时的调试信息。那么如何获取其他网页的信息呢？谢谢你的回复。

Answer 1

我在调试chrome扩展时发现非常有用的一件事是使用chrome开发人员工具的“inspect element”功能。如果您有要调试的页面或元素（例如扩展名中的弹出窗口）：

Open up Developer Tools
Wait for your popup to appear (if its not already up)
Switch to the Elements view on Developer Tools
Click the magnifying glass at the bottom so you can select an element
Click on an element in the page you want to debug (e.g. the popup page)

现在，您的“来源”视图和其他视图会排成一行，以匹配您点击的元素。现在，控制台将让您查看该上下文中的变量。

如果您无法使分机工作，可能有很多原因。

1. 您的所有脚本都是从扩展程序目录加载的，还是您正在服务 他们来自一个网站？ Chrome不会从外部网站加载脚本 除非在提供脚本的站点之后通过https AND 被列入白名单。查看Chrome Content Security Policy 了解更多信息。
2. 要检查DOM，您需要将内容脚本注入正在加载的页面中。你确定你这样做了吗？ manifest.json必须正确完成，否则你的content script将无法加载。
3. 要使您的内容脚本和扩展程序进行通信，您必须发布和接收消息。更多信息是available here。

也许我最好的建议是你仔细地跟随Chrome extension "tutorial"，直到你有一些工作，然后根据你的需要进行修改。