Datadog client token: For security reasons, API keys cannot be used to configure the browser logs SDK, because they would be exposed client-side in the JavaScript code. To collect logs from web browsers, a client token must be used. See the client token documentation for more details.
Datadog browser logs SDK: Configure the SDK through NPM or use the CDN async or CDN sync code snippets in the head tag.
Supported browsers: The browser logs SDK supports all modern desktop and mobile browsers. See the Browser Support table.
This method is recommended for modern web applications. The browser logs SDK gets packaged with the rest of your front-end javascript code. It has no impact on page load performance. However, the SDK might miss errors, resources and user actions triggered before the SDK is initialized. Note: it is recommended to use a matching version with RUM SDK if used.
CDN async
This method is recommended for web applications with performance targets. The browser logs SDK is loaded from our CDN asynchronously: this method ensures the SDK download does not impact page load performance. However, the SDK might miss errors, resources and user actions triggered before the SDK is initialized.
CDN sync
This method is recommended for collecting all RUM events. The browser logs SDK is loaded from our CDN synchronously: this method ensures the SDK is loaded first and collects all errors, resources and user actions. This method might impact page load performance.
Load and configure the SDK in the head section of your pages. For US1 site:
<html><head><title>Example to send logs to Datadog</title><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=nn=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)})(window,document,'script','https://www.datadoghq-browser-agent.com/us1/v6/datadog-logs.js','DD_LOGS')window.DD_LOGS.onReady(function(){window.DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'datadoghq.com',forwardErrorsToLogs:true,sessionSampleRate:100,})})</script></head></html>
<html><head><title>Example to send logs to Datadog</title><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=nn=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)})(window,document,'script','https://www.datadoghq-browser-agent.com/ap1/v6/datadog-logs.js','DD_LOGS')DD_LOGS.onReady(function(){DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'ap1.datadoghq.com',forwardErrorsToLogs:true,sessionSampleRate:100,})})</script></head></html>
<html><head><title>Example to send logs to Datadog</title><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=nn=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)})(window,document,'script','https://www.datadoghq-browser-agent.com/eu1/v6/datadog-logs.js','DD_LOGS')window.DD_LOGS.onReady(function(){window.DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'datadoghq.eu',forwardErrorsToLogs:true,sessionSampleRate:100,})})</script></head></html>
<html><head><title>Example to send logs to Datadog</title><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=nn=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)})(window,document,'script','https://www.datadoghq-browser-agent.com/us3/v6/datadog-logs.js','DD_LOGS')window.DD_LOGS.onReady(function(){window.DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'us3.datadoghq.com',forwardErrorsToLogs:true,sessionSampleRate:100,})})</script></head></html>
<html><head><title>Example to send logs to Datadog</title><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=nn=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)})(window,document,'script','https://www.datadoghq-browser-agent.com/us5/v6/datadog-logs.js','DD_LOGS')window.DD_LOGS.onReady(function(){window.DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'us5.datadoghq.com',forwardErrorsToLogs:true,sessionSampleRate:100,})})</script></head></html>
<html><head><title>Example to send logs to Datadog</title><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=nn=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)})(window,document,'script','https://www.datadoghq-browser-agent.com/datadog-logs-v6.js','DD_LOGS')window.DD_LOGS.onReady(function(){window.DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'ddog-gov.com',forwardErrorsToLogs:true,sessionSampleRate:100,})})</script></head></html>
Note: Early API calls must be wrapped in the window.DD_LOGS.onReady() callback. This ensures the code only gets executed once the SDK is properly loaded.
To receive all logs and errors, load and configure the SDK at the beginning of the head section for your pages. For US1 site:
<html><head><title>Example to send logs to Datadog</title><scripttype="text/javascript"src="https://www.datadoghq-browser-agent.com/us1/v6/datadog-logs.js"></script><script>window.DD_LOGS&&window.DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'datadoghq.com',forwardErrorsToLogs:true,sessionSampleRate:100,})</script></head></html>
<html><head><title>Example to send logs to Datadog</title><scripttype="text/javascript"src="https://www.datadoghq-browser-agent.com/ap1/v6/datadog-logs.js"></script><script>window.DD_LOGS&&DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'ap1.datadoghq.com',forwardErrorsToLogs:true,sessionSampleRate:100,})</script></head></html>
<html><head><title>Example to send logs to Datadog</title><scripttype="text/javascript"src="https://www.datadoghq-browser-agent.com/eu1/v6/datadog-logs.js"></script><script>window.DD_LOGS&&window.DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'datadoghq.eu',forwardErrorsToLogs:true,sessionSampleRate:100,})</script></head></html>
<html><head><title>Example to send logs to Datadog</title><scripttype="text/javascript"src="https://www.datadoghq-browser-agent.com/us3/v6/datadog-logs.js"></script><script>window.DD_LOGS&&window.DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'us3.datadoghq.com',forwardErrorsToLogs:true,sessionSampleRate:100,})</script></head></html>
<html><head><title>Example to send logs to Datadog</title><scripttype="text/javascript"src="https://www.datadoghq-browser-agent.com/us5/v6/datadog-logs.js"></script><script>window.DD_LOGS&&window.DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'us5.datadoghq.com',forwardErrorsToLogs:true,sessionSampleRate:100,})</script></head></html>
<html><head><title>Example to send logs to Datadog</title><scripttype="text/javascript"src="https://www.datadoghq-browser-agent.com/datadog-logs-v6.js"></script><script>window.DD_LOGS&&window.DD_LOGS.init({clientToken:'<DATADOG_CLIENT_TOKEN>',site:'ddog-gov.com',forwardErrorsToLogs:true,sessionSampleRate:100,})</script></head></html>
Note: The window.DD_LOGS check prevents issues when a loading failure occurs with the SDK.
The application’s environment, for example: prod, pre-prod, staging, and so on. It should follow the tag syntax requirements.
version
String
No
The application’s version, for example: 1.2.3, 6c44da20, 2020.02.13, and so on. It should follow the tag syntax requirements.
forwardErrorsToLogs
Boolean
No
true
Set to false to stop forwarding console.error logs, uncaught exceptions and network errors to Datadog.
forwardConsoleLogs
"all" or an Array of "log""debug""info""warn""error"
No
[]
Forward logs from console.* to Datadog. Use "all" to forward everything or an array of console API names to forward only a subset.
forwardReports
"all" or an Array of "intervention""deprecation""csp_violation"
No
[]
Forward reports from the Reporting API to Datadog. Use "all" to forward everything or an array of report types to forward only a subset.
sampleRate
Number
No
100
Deprecated - see sessionSampleRate.
sessionSampleRate
Number
No
100
The percentage of sessions to track: 100 for all, 0 for none. Only tracked sessions send logs. It applies only to logs collected via the Browser Logs SDK and is independent of RUM data.
Telemetry data (error, debug logs) about SDK execution is sent to Datadog in order to detect and solve potential issues. Set this option to 0 to opt out from telemetry collection.
storeContextsAcrossPages
Boolean
No
Store global context and user context in localStorage to preserve them along the user navigation. See Contexts life cycle for more details and specific limitations.
allowUntrustedEvents
Boolean
No
Allow capture of untrusted events, for example in automated UI tests.
sendLogsAfterSessionExpiration
Boolean
No
Keep sending logs after the session expires.
Options that must have a matching configuration when using the RUM SDK:
Parameter
Type
Required
Default
Description
sessionPersistence
"cookie" or "local-storage"
No
"cookie"
Which storage strategy to use for persisting sessions. Can be either cookie or local-storage.
trackAnonymousUser
Boolean
No
true
Enables collection of anonymous user id across sessions.
trackSessionAcrossSubdomains
Boolean
No
false
Preserve the session across subdomains for the same site.
useSecureSessionCookie
Boolean
No
false
Use a secure session cookie. This disables logs sent on insecure (non-HTTPS) connections.
usePartitionedCrossSiteSessionCookie
Boolean
No
false
Use a partitioned secure cross-site session cookie. This allows the logs SDK to run when the site is loaded from another one (iframe). Implies useSecureSessionCookie.
usePciIntake
Boolean
No
false
To forward logs to the PCI-compliant intake, set to true. The PCI-compliant intake is only available for Datadog organizations in the US1 site. If usePciIntake is set to true and the site is not US1 (datadoghq.com), logs are sent to the default intake.
Note: Early API calls must be wrapped in the window.DD_LOGS.onReady() callback. This ensures the code only gets executed once the SDK is properly loaded.
The Datadog browser logs SDK allows for manual error tracking by using the optional error parameter (Available in SDK v4.36.0+). When an instance of a JavaScript Error is provided, the SDK extracts relevant information (kind, message, stack trace) from the error.
Note: Early API calls must be wrapped in the window.DD_LOGS.onReady() callback. This ensures the code only gets executed once the SDK is properly loaded.
The Datadog browser logs SDK adds shorthand functions (.debug, .info, .warn, .error) to the loggers for convenience. A generic logger function is also available, exposing the status parameter:
Note: Early API calls must be wrapped in the window.DD_LOGS.onReady() callback. This ensures the code only gets executed once the SDK is properly loaded.
If your Browser logs contain sensitive information that needs redacting, configure the Browser SDK to scrub sensitive sequences by using the beforeSend callback when you initialize the Browser Log Collector.
The beforeSend callback function can be invoked with two arguments: the log event and context. This function gives you access to each log collected by the Browser SDK before it is sent to Datadog, and lets you use the context to adjust any log properties. The context contains additional information related to the event, but not necessarily included in the event. You can typically use this information to enrich your event or discard it.
functionbeforeSend(log,context)
The potential context values are:
Value
Data Type
Use Case
isAborted
Boolean
For network log events, this property tells you whether the failing request was aborted by the application, in which case you might not want to send this event because it may be intentionally aborted.
handlingStack
String
A stack trace of where the log event was handled. This can be used to identify which micro-frontend the log was sent from.
To redact email addresses from your web application URLs:
It can then be used in a different part of the code with:
window.DD_LOGS.onReady(function(){constsignupLogger=window.DD_LOGS.getLogger('signupLogger')signupLogger.info('Test sign up completed')})
Note: Early API calls must be wrapped in the window.DD_LOGS.onReady() callback. This ensures the code only gets executed once the SDK is properly loaded.
Note: Early API calls must be wrapped in the window.DD_LOGS.onReady() callback. This ensures the code only gets executed once the SDK is properly loaded.
The Datadog logs SDK provides convenient functions to associate a User with generated logs.
Set the user for all your loggers with the setUser (newUser: User) API.
Add or modify a user property to all your loggers with the setUserProperty (key: string, value: any) API.
Get the currently stored user with the getUser () API.
Remove a user property with the removeUserProperty (key: string) API.
Clear all existing user properties with the clearUser () API.
Note: The user context is applied before the global context. Hence, every user property included in the global context will override the user context when generating logs.
Note: Early API calls must be wrapped in the window.DD_LOGS.onReady() callback. This ensures the code only gets executed once the SDK is properly loaded.
By default, global context and user context are stored in the current page memory, which means they are not:
kept after a full reload of the page
shared across different tabs or windows of the same session
To add them to all events of the session, they must be attached to every page.
With the introduction of the storeContextsAcrossPages configuration option in the v4.49.0 of the browser SDK, those contexts can be stored in localStorage, allowing the following behaviors:
Contexts are preserved after a full reload
Contexts are synchronized between tabs opened on the same origin
However, this feature comes with some limitations:
Setting Personable Identifiable Information (PII) in those contexts is not recommended, as data stored in localStorage outlives the user session
The feature is incompatible with the trackSessionAcrossSubdomains options because localStorage data is only shared among the same origin (login.site.com ≠ app.site.com)
localStorage is limited to 5 MiB by origin, so the application-specific data, Datadog contexts, and other third-party data stored in localStorage must be within this limit to avoid any issues
Note: Early API calls must be wrapped in the window.DD_LOGS.onReady() callback. This ensures the code only gets executed once the SDK is properly loaded.
Note: Early API calls must be wrapped in the window.DD_LOGS.onReady() callback. This ensures the code only gets executed once the SDK is properly loaded.
By default, loggers created by the Datadog browser logs SDK are sending logs to Datadog. After the Datadog browser logs SDK is initialized, it is possible to configure the logger to:
Note: Early API calls must be wrapped in the window.DD_LOGS.onReady() callback. This ensures the code only gets executed once the SDK is properly loaded.
To be compliant with GDPR, CCPA and similar regulations, the Logs Browser SDK lets you provide the tracking consent value at initialization.
The trackingConsent initialization parameter can be one of the following values:
"granted": The Logs Browser SDK starts collecting data and sends it to Datadog.
"not-granted": The Logs Browser SDK does not collect any data.
To change the tracking consent value after the Logs Browser SDK is initialized, use the setTrackingConsent() API call. The Logs Browser SDK changes its behavior according to the new value:
when changed from "granted" to "not-granted", the Logs session is stopped, and data is no longer sent to Datadog.
when changed from "not-granted" to "granted", a new Logs session is created if no previous session is active, and data collection resumes.
This state is not synchronized between tabs nor persisted between navigation. It is your responsibility to provide the user decision during Logs Browser SDK initialization or by using setTrackingConsent().
When setTrackingConsent() is used before init(), the provided value takes precedence over the initialization parameter.