CDN

Sentry supports loading its JavaScript SDK via a CDN. Generally we suggest using our npm package (@sentry/browser) as utilizing a CDN create scenarios where Sentry is unable to load due to networking issues or common extensions like ad blockers. If you must use a CDN, take a look at loading Sentry lazily with our JS loader.

Copied
<script
  src="https://browser.sentry-cdn.com/6.16.1/bundle.min.js"
  integrity="sha384-WkFzsrcXKeJ3KlWNXojDiim8rplIj1RPsCbuv7dsLECoXY8C6Cx158CMgl+O+QKW"
  crossorigin="anonymous"
></script>

Performance Bundle

To use Sentry's performance tracing an alternative bundle is needed. This allows us to keep the filesize down for users who only need error monitoring.

Copied
<script
  src="https://browser.sentry-cdn.com/6.16.1/bundle.tracing.min.js"
  integrity="sha384-hySah00SvKME+98UjlzyfP852AXjPPTh2vgJu26gFcwTlZ02/zm82SINaKTKwIX2"
  crossorigin="anonymous"
></script>

The most important thing to note here is that Sentry.Integrations has been made available, and can be referenced in your call to Sentry.init:

Copied
Sentry.init({
  dsn: "https://examplePublicKey@o0.ingest.sentry.io/0",
  // this assumes your build process sets "npm_package_version" in the env
  release: "my-project-name@" + process.env.npm_package_version,
  integrations: [new Sentry.Integrations.BrowserTracing()],

  // We recommend adjusting this value in production, or using tracesSampler
  // for finer control
  tracesSampleRate: 1.0,
});

Available Bundles

A variety of bundles are provided which are optimized for Sentry's various integrations.

FileIntegrity Checksum
angular.jssha384-VL0RVDUaUgiLrpIiHIgZGAQC1g1nDAjG9tAA6YmD+G7KrSA5nO3aiGCk/65n3056
angular.min.jssha384-A5F1fQ1n09vim5tfXnNdN2iFa8bLbVKdgxJ4ZrtjCHLYqktoAkFhGwsLjdxjyc9O
bundle.es6.jssha384-dCu0XaZ2HmJWg42AnG5J81Hb5OSrW9adwPwdF38ud6+yJFwKD1KuMOl9zu2Ni93b
bundle.es6.min.jssha384-DpAAZf9q6jgsejLMV1M4p+fbjbpwv6JRClOsMaPPQydUMXHAXPkqSUj1KCSHoLO3
bundle.jssha384-kSpBr4IrB0gtfj90piCp+nG0HxRESlHyXr0/IYrlPtWthWgEfnyXcy3dUA53IuOo
bundle.min.jssha384-WkFzsrcXKeJ3KlWNXojDiim8rplIj1RPsCbuv7dsLECoXY8C6Cx158CMgl+O+QKW
bundle.tracing.jssha384-eO9oiriTnvqWd+QIhxzSbuQIMC8i7DYrcXq+EClg08s8fFIdt/MrLckSbQVGT/yA
bundle.tracing.min.jssha384-hySah00SvKME+98UjlzyfP852AXjPPTh2vgJu26gFcwTlZ02/zm82SINaKTKwIX2
captureconsole.jssha384-PNCRSrfPTRYH9Z3aGjMbzUipj1Y75fhmATP2wN5VQsfiAEJ3dD2gas341rYMG9qu
captureconsole.min.jssha384-AEmGERTNfL9LX+mYYZU0Usk7/5PVRnQFJh+Qn7zuvdNeG7p3eYbJPqQJGQRh/xQy
debug.jssha384-SG+EbpLqbGz4GDsWCQi1ALynuElQ5wEmsMe+JrBNbEn84MvPymCoIS3UTfdka4w4
debug.min.jssha384-zbKoRCEZ20CRAbQIOcCbEf68Vc/fg3irjnRauIHHLCpO5KZV4yFy4TZvbkpBhbRC
dedupe.jssha384-sygG+VWe55vD9q3Wzu0DQiW9vHq165NjtqkpPSeZLjugM0+rcDEgJoQsazbrZILl
dedupe.min.jssha384-h0zd4AV1PE/hrsAvmyBkMbIrBN/XMscvqWh4rsMUbYEdaEypIiYIjOFVOjYXO2vs
ember.jssha384-9VnV/CkQGXtqemdZHQTF/Tq5F9o204V5As4GIHqR0y+gVRQju2Uu7kBBB97unfXr
ember.min.jssha384-12L9iDFal1s6YlLa99Ygtda7CZiZv0oaCtQNCfN07Aw0OK1PcixFZpv1GqULXYxN
extraerrordata.jssha384-5SJjwElGr6axHrhTg0tqqPOifLra3f6C53Ktfa6Fwg0vaAAZLlRDcwNsZmxeMgEO
extraerrordata.min.jssha384-rdZoevEpLP2pdzgpFFzt1/TdRVhr3lsxJuK1CLYqg+0Izn73KXZ5EDOSyG8gD2Ig
offline.jssha384-4FLK1aciicQEnZvO+47er9vhZYejJUBuCen429tDfzT+zpyKpSSl15j4v4ltwTa4
offline.min.jssha384-axYHRwN9Y3cpYn2Fc9nl0PS46Je2QRyg6xLCY3P0DXVsp373kzPk580O0GkbXdEQ
reportingobserver.jssha384-NMjf3JRX5HNzdSr87ik22wQ/OqPUTNAXF/7uo4P+a7kB4/YU/VtOF4ZKOtom3ZRF
reportingobserver.min.jssha384-3lsEV8xp2op6aCt43kKEDFZoPvdcd+eqkDBLa8E2oqaxxhbS1kr0DoPVOk0CqUnM
rewriteframes.jssha384-RDQWYaTAufzGuPPBMMukWwFp5/AtjmnXWRKzLq1yKjvGH9GUsvSh7Qrdwd/v7KYK
rewriteframes.min.jssha384-CkbK6ocsfInQTxhAozTyi3ELyXqkT0QFL8fczBgiuyqsiHeKsDSfFeWgd655x6Pk
sessiontiming.jssha384-9srvADRpjm3FrmiK6dY0NGV4wnTG4dt8onLWUx6LRVN1xhtw+oRJnQ1LtKi4kqGB
sessiontiming.min.jssha384-yy0Jah9kyZt8VCnKVBxDj92pIC/E9XFkw5G6NXx2+0ZJbTBn83Y3X32KqAZxhF9b
transaction.jssha384-KN4xQF97K+t2Zgsqg8FiZE5++QLb0PCD4+v0k0ZVg6rl47vvmUIiSueozKB29Gu1
transaction.min.jssha384-p+n3NUtytg2Zgunyx5gQNdbZk7AieZyquN8nOaL7+hbqbe0SZomZIQJ5apsiXuLd
vue.jssha384-j0q1arzLtOXOnTXqaIHIuwQuBQUCnL8o0MWpTxUiaarfU76JwoV9d7jm8Vfmt2hs
vue.min.jssha384-Mo4n/lpXgTgx5VEXGbKQJr6l+Qv1jVHXQZprvNbg0hSUbKwsa3nAYfcOK8iIFDL5

Additional Configuration

Using defer

If you use the defer script attribute, we strongly recommend that you place the script tag for the browser SDK first and mark all of your other scripts with defer (but not async). This will guarantee that that the Sentry SDK is executed before any of the others.

Without doing this you will find that it's possible for errors to occur before Sentry is loaded, which means you'll be flying blind to those issues.

Content Security Policy

If you have a Content Security Policy (CSP) set up on your site, you will need to add the script-src of wherever you're loading the SDK from, and the origin of your DSN. For example:

  • script-src: https://browser.sentry-cdn.com
  • connect-src: *.sentry.io
Help improve this content
Our documentation is open source and available on GitHub. Your contributions are welcome, whether fixing a typo (drat!) to suggesting an update ("yeah, this would be better").