在哪里放置Bugsnag脚本以进行Chrome扩展集成

时间:2016-03-17 17:06:04

标签: debugging google-chrome-extension bugsnag

我是第一次使用Chrome扩展程序并尝试集成Bugsnag js错误报告。

我发现了很多useful information,但我不明白如何将bugsnag实际加载到扩展中。 (例如,在后台脚本,内容脚本,background.html页面或其他地方)。您是否编写代码以将脚本标记插入页面?

Bugsnag setup docs建议配置

<script src="//d2wy8f7a9ursnm.cloudfront.net/bugsnag-2.min.js"
     data-apikey="YOUR-API-KEY-HERE"></script>

我尝试将其添加到background.html页面,但没有运气。我还尝试将cloudfront脚本添加到扩展中的内容和后台脚本,但是无法加载它。

Uncaught ReferenceError: Bugsnag is not defined

同样,哪里是引用bugsnag脚本并修改Bugsnag对象的最佳位置(例如

Bugsnag.beforeNotify = function (error, metaData) {
    error.stacktrace = error.stacktrace.replace(/chrome-extension:/g, "chromeextension:");
}

允许扩展错误达到bugsnag,如建议here

意识到这是一个非常基本的设置问题,但在找到这个特定用例的方向时遇到了一些麻烦。谢谢你的任何建议!

1 个答案:

答案 0 :(得分:0)

您正在尝试包含外部脚本。这将是艰难的 - 扩展主要期望他们的所有资源都捆绑在一起。

对于扩展页面(背景/弹出窗口),是的,您可以包含它,但是:

  1. 您需要declare a CSP允许此代码作为例外。

  2. 您必须在https://上明确加载,协议相对网址//...会失败,因为原始网址为chrome-extension://...

  3. 对于内容脚本,它会变得更复杂。您无法使用代码方法,因为<script>标记中的任何内容都会转到页面上下文,而不是content script context

    因此 需要使用executeScript注入,之前已使用XHR下载(您无法为executeScript指定远程网址,但您可以指定包含代码的字符串)。显然,您需要使用替代方法set the API key

    请注意Bugsnag mentions在本地捆绑代码的可能性:

      

    如果您想避免额外的阻止请求,可以在资产编译过程中加入javascript,以便将其内联到现有的脚本文件中。唯一可以肯定的是,在你的onload处理程序运行之前就包含了Bugsnag。

    因此,可以安全地忽略上述所有内容。但是你可以自己更新脚本。