获取更多动态,关注公众号:黑客下午茶

Lazy Loading Sentry

Loader 是我们 SDK 的一个小型包装器,它可以做一些事情:

  • 始终拥有我们 SDK 的最新推荐稳定版本
  • 捕获所有全局错误未处理的 promise rejections
  • 延迟注入我们的 SDK 到您的网站
  • 加载 SDK 后,Loader 会将所有内容发送给 Sentry

loader 的压缩量(gzipped)小于 1kB,并且在您的 DSN 中包含 Sentry.init 调用。

Copied
<script
  src="https://js.sentry-cdn.com/examplePublicKey.min.js"
  crossorigin="anonymous"
></script>

附加配置

如果要设置其他选项,则必须像这样设置它们:

onLoad 是 Loader 仅提供的功能;一旦将 SDK 注入网站,Loader 就会调用它。Loader 的 init() 工作原理也有所不同。为了方便起见,我们在内部合并了这些选项,而不仅仅是设置选项,这是为了方便起见,因此您不必再次设置 DSN,因为 Loader 已经包含了它。

如前所述,Loader 会延迟加载我们的 SDK 并将其注入您的网站,但您也可以告诉 loader 立即获取它,而不是仅在需要时获取它。将 data-lazy 设置为 no 将告诉 Loader 尽快注入 SDK:

Copied
<script>
  Sentry.onLoad(function() {
    // 使用任何你想要的 Sentry.* 函数
  });
  Sentry.forceLoad();
</script>

SDK 版本

进入 Sentry Web UI,查看 Settings -> Projects -> Client Keys (DSN),然后按 Configure 按钮。 在这里,您可以查看用于配置 DSN 的选项,并选择 Loader 应加载的 SDK 版本。

JavaScript Loader Settings

当前限制

由于我们以异步方式注入我们的 SDK,因此我们将仅为您监视全局错误未处理的 promise,直到 SDK 完全加载为止。这意味着在下载过程中我们可能会错过 breadcrumbs(面包屑)。

例如,用户单击您网站上的按钮正在发出 XHR 请求。在 SDK 完全加载之前,我们不会遗漏任何错误,只会遗留 breadcrumbs(面包屑)。您可以通过手动调用 forceLoad 或设置 data-lazy="no" 来减少此时间。

如果您想了解 loader 本身的内部工作原理,则可以在 sentry-javascript repository 中全面阅读文档化的源代码。

You can edit this page on GitHub.