Chrome Extensions
Learn how to set up the Sentry Flutter SDK for Chrome Extensions with Flutter Web.
Chrome Extensions enforce strict Content Security Policy (CSP) rules that prevent dynamically loaded scripts. Since the Sentry Flutter SDK typically loads the Sentry JavaScript SDK dynamically for web platforms, you need to include the Sentry JavaScript bundle as a static asset instead.
Instead of loading the Sentry JavaScript SDK dynamically, you need to include it as a static asset:
Download the minified Sentry JavaScript bundle from the Sentry CDN. Use the version that is compatible with the Sentry Flutter SDK: bundle.tracing.min.js
Download the Sentry Javascript bundle with the appropriate version for your project. Check the Sentry Flutter SDK releases to find the version of the Sentry Javascript SDK that is used in a specific Sentry Flutter SDK release.
Save this file to your Flutter Web project's
web/directory.
Add the Sentry JavaScript bundle to your web/index.html file:
web/index.html<!DOCTYPE html>
<html>
<head>
<!-- Other head elements -->
<script
src="bundle.tracing.min.js"
type="application/javascript"
></script>
</head>
<body>
<!-- Your app content -->
</body>
</html>
Build your Flutter Web app for Chrome Extensions.
Ensure that the bundle.tracing.min.js file is included in your web/ directory before building.
After building your application, upload the generated source maps to Sentry to enable proper symbolication of stack traces using the sentry_dart_plugin.
Our documentation is open source and available on GitHub. Your contributions are welcome, whether fixing a typo (drat!) or suggesting an update ("yeah, this would be better").