- 필수 기능
- 시작하기
- Glossary
- 표준 속성
- Guides
- Agent
- 통합
- 개방형텔레메트리
- 개발자
- Administrator's Guide
- API
- Datadog Mobile App
- CoScreen
- Cloudcraft
- 앱 내
- 서비스 관리
- 인프라스트럭처
- 애플리케이션 성능
- APM
- Continuous Profiler
- 스팬 시각화
- 데이터 스트림 모니터링
- 데이터 작업 모니터링
- 디지털 경험
- 소프트웨어 제공
- 보안
- AI Observability
- 로그 관리
- 관리
",t};e.buildCustomizationMenuUi=t;function n(e){let t='
",t}function s(e){let n=e.filter.currentValue||e.filter.defaultValue,t='${e.filter.label}
`,e.filter.options.forEach(s=>{let o=s.id===n;t+=``}),t+="${e.filter.label}
`,t+=`Error Tracking processes errors collected from the browser by the Browser SDK. Whenever a source, custom, report, or console error containing a stack trace is collected, Error Tracking processes and groups it under an issue, or group of similar errors to be found in the Error Tracking Explorer.
Download the latest version of the Browser SDK.
To start sending Error Tracking data from your browser application to Datadog, follow the in-app setup instructions or follow the steps below.
clientToken
and an applicationId
for your application.Choose the installation type for the Browser SDK.
Installing through npm (Node Package Manager) is recommended for modern web applications. The Browser SDK is packaged with the rest of your frontend JavaScript code. It has no impact on page load performance. However, the SDK may miss errors, resources, and user actions triggered before the SDK is initialized. Datadog recommends using a matching version with the Browser Logs SDK.
Add @datadog/browser-rum
to your package.json
file, then initialize it with:
import { datadogRum } from '@datadog/browser-rum';
datadogRum.init({
applicationId: '<APP_ID>',
clientToken: '<CLIENT_TOKEN>',
service: '<SERVICE>',
env: '<ENV_NAME>',
// site: '<SITE>',
// version: '1.0.0',
trackUserInteractions: true,
trackResources: true
});
The trackUserInteractions
parameter enables the automatic collection of user clicks in your application. Sensitive and private data contained in your pages may be included to identify the elements interacted with.
Installing through CDN async is recommended for web applications with performance targets. The Browser SDK loads from Datadog’s CDN asynchronously, ensuring the SDK download does not impact page load performance. However, the SDK may miss errors, resources, and user actions triggered before the SDK is initialized.
Add the generated code snippet to the head tag of every HTML page you want to monitor in your application. For the site:
<script>
(function(h,o,u,n,d) {
h=h[d]=h[d]||{q:[],onReady:function(c){h.q.push(c)}}
d=o.createElement(u);d.async=1;d.src=n
n=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)
})(window,document,'script','https://www.datadoghq-browser-agent.com/us1/v6/datadog-rum.js','DD_RUM')
window.DD_RUM.onReady(function() {
window.DD_RUM.init({
clientToken: '<CLIENT_TOKEN>',
applicationId: '<APP_ID>',
// site: '<SITE>',
service: '<APP_ID>',
env: '<ENV_NAME>',
// version: '1.0.0'
});
})
</script>
The trackUserInteractions
parameter enables the automatic collection of user clicks in your application. Sensitive and private data contained in your pages may be included to identify the elements interacted with.
Installing through CDN sync is recommended for collecting all events. The Browser SDK loads from Datadog’s CDN synchronously, ensuring the SDK loads first and collects all errors, resources, and user actions. This method may impact page load performance.
Add the generated code snippet to the head tag (in front of any other script tags) of every HTML page you want to monitor in your application. Placing the script tag higher and loading it synchronously ensures Datadog RUM can collect all performance data and errors. For the site:
<script
src="https://www.datadoghq-browser-agent.com/us1/v6/datadog-rum.js"
type="text/javascript">
</script>
<script>
window.DD_RUM && window.DD_RUM.init({
clientToken: '<CLIENT_TOKEN>',
applicationId: '<APP_ID>',
// site: '<SITE>',
service: '<APP_ID>',
env: '<ENV_NAME>',
// version: '1.0.0'
});
</script>
The trackUserInteractions
parameter enables the automatic collection of user clicks in your application. Sensitive and private data contained in your pages may be included to identify the elements interacted with.
If you are initializing the SDK in a TypeScript project, use the code snippet below. Types are compatible with TypeScript >= 3.8.2.
import '@datadog/browser-rum/bundle/datadog-rum'
window.DD_RUM.init({
applicationId: 'XXX',
clientToken: 'XXX',
site: 'datadoghq.com',
trackUserInteractions: true,
trackResources: true,
...
})
env
) for your application to use unified service tagging.service
) for your application to use unified service tagging.version
) for your deployed application in the initialization snippet. For more information, see Tagging.Deploy the changes to your application. After your deployment is live, Datadog collects events from your users’ browsers.
Upload your JavaScript source maps to access unminified stack traces. See the source map upload guide.
Now that you’ve completed the basic setup for Browser Error Tracking, your application is collecting browser errors and you can start monitoring and debugging issues in real-time.
Visualize the data collected in dashboards or create a search query in Error Tracking.
Until Datadog starts receiving data, your application appears as pending
on the Applications page.
In addition to sending source maps, the Datadog CLI reports Git information such as the commit hash, repository URL, and a list of tracked file paths in the code repository.
Error Tracking can use this information to correlate errors with your source code, allowing you to pivot from any stack trace frame to the related line of code in GitHub, GitLab and Bitbucket.
0.12.0
and later.For more information, see the Datadog Source Code Integration.
These tags (configured in step 3 above) power Error Tracking functionality:
service
and env
service
/env
service
and version
you configure during uploadA service is an independent, deployable code repository that maps to a set of pages:
Learn more about tagging in Datadog.
Refer to the Browser SDK API Reference for the full list of available configuration options.
See all uploaded symbols and manage your source maps on the Debug Symbols page.
Note: Source maps are limited in size to 500 MB each.
You can monitor unhandled exceptions, unhandled promise rejections, handled exceptions, handled promise rejections, and other errors that the Browser SDK does not automatically track. Learn more about Collecting Browser Errors.