You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/platforms/dart/guides/flutter/configuration/chrome-extensions.mdx
+20-4Lines changed: 20 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,24 +2,38 @@
2
2
title: Chrome Extensions
3
3
description: "Learn how to set up the Sentry Flutter SDK for Chrome Extensions with Flutter Web."
4
4
sidebar_order: 10
5
+
sdk: sentry.dart.flutter
6
+
categories:
7
+
- dart
8
+
- flutter
5
9
---
6
10
7
-
When building Flutter Web applications that will be packaged as Chrome Extensions, there are specific configuration requirements due to Chrome's Content Security Policy (CSP) restrictions. This guide walks you through the necessary setup steps.
11
+
<Alertlevel="warning">
12
+
13
+
Chrome Extensions enforce strict Content Security Policy (CSP) rules that prevent dynamically loaded scripts. The standard Sentry Flutter SDK setup will not work in Chrome Extension environments without the modifications outlined in this guide.
14
+
15
+
</Alert>
8
16
9
17
## Overview
10
18
11
-
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, this approach won't work in Chrome Extension environments.
19
+
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.
12
20
13
21
## Required Setup
14
22
15
23
### 1. Download the Sentry JavaScript Bundle
16
24
17
25
Instead of loading the Sentry JavaScript SDK dynamically, you need to include it as a static asset:
18
26
19
-
1. Download the minified Sentry JavaScript bundle. For example, for version 9.40.0:
27
+
1. Download the minified Sentry JavaScript bundle from the Sentry CDN. Use the version that is compatible with the Sentry Flutter SDK:
Replace `9.40.0` with the appropriate version for your project. Check the [Sentry Flutter SDK releases](https://github.com/getsentry/sentry-dart/releases) to find the version of the Sentry Javascript SDK that is used in a specific Sentry Flutter SDK release.
35
+
36
+
</Alert>
23
37
24
38
2. Save this file to your Flutter Web project's `web/` directory.
25
39
@@ -44,6 +58,8 @@ Add the Sentry JavaScript bundle to your `web/index.html` file:
44
58
45
59
Build your Flutter Web app for Chrome Extensions.
46
60
61
+
Ensure that the `bundle.tracing.min.js` file is included in your `web/` directory before building.
62
+
47
63
### 4. Upload Source Maps
48
64
49
-
After building your application, upload the generated source maps to Sentry using the [sentry_dart_plugin](/platforms/dart/guides/flutter/debug-symbols/dart-plugin/).
65
+
After building your application, upload the generated source maps to Sentry to enable proper symbolication of stack traces using the [sentry_dart_plugin](/platforms/dart/guides/flutter/debug-symbols/dart-plugin/).
0 commit comments