Envía registros a Datadog desde páginas del navegador con el SDK de registros del navegador.

Con el SDK de registros del navegador, puedes enviar registros directamente a Datadog desde páginas del navegador y aprovechar las siguientes características:

• Utiliza el SDK como logger. Todo se envía a Datadog como documentos JSON.
• Agrega context y atributos personalizados adicionales a cada registro enviado.
• Envuelve y reenvía automáticamente cada error del frontend.
• Reenvía errores del frontend.
• Registra direcciones IP reales de cliente y agentes de usuario.
• Uso de red optimizado con publicaciones automáticas en bloque.
• Usa en entornos de Worker y Service Worker.

Notas:

• Independiente del SDK de RUM: El SDK de registros del navegador se puede usar sin el SDK de RUM.
• Entornos de Worker: El SDK de registros del navegador funciona en entornos de Worker y Service Worker utilizando los mismos métodos de configuración. Sin embargo, los registros enviados desde entornos de Worker no incluyen automáticamente información de sesión.

Configuración

Paso 1 - Crear un token de cliente

En Datadog, navega a Configuración de la Organización > Nuevos Tokens de Cliente

Entornos soportados: El SDK de registros del navegador soporta todos los navegadores de escritorio y móviles modernos, así como entornos de Worker y Service Worker. Consulta la tabla de Soporte del Navegador.

Paso 2 - Instalar el SDK de registros del navegador

Elige el método de instalación para el SDK de registros del navegador.

<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;d.crossOrigin=''
    n=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')
</script>

<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;d.crossOrigin=''
    n=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)
  })(window,document,'script','https://www.datadoghq-browser-agent.com/eu/v6/datadog-logs.js','DD_LOGS')
</script>

<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;d.crossOrigin=''
    n=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')
</script>

<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;d.crossOrigin=''
    n=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)
  })(window,document,'script','https://www.datadoghq-browser-agent.com/ap2/v6/datadog-logs.js','DD_LOGS')
</script>

<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;d.crossOrigin=''
    n=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')
</script>

<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;d.crossOrigin=''
    n=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')
</script>

<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;d.crossOrigin=''
    n=o.getElementsByTagName(u)[0];n.parentNode.insertBefore(d,n)
  })(window,document,'script','https://www.datadoghq-browser-agent.com/datadog-logs-v6.js','DD_LOGS')
</script>

<script
    src="https://www.datadoghq-browser-agent.com/us1/v6/datadog-logs.js"
    type="text/javascript"
    crossorigin>
</script>

<script
    src="https://www.datadoghq-browser-agent.com/eu/v6/datadog-logs.js"
    type="text/javascript"
    crossorigin>
</script>

<script
    src="https://www.datadoghq-browser-agent.com/ap1/v6/datadog-logs.js"
    type="text/javascript"
    crossorigin>
</script>

<script
    src="https://www.datadoghq-browser-agent.com/ap2/v6/datadog-logs.js"
    type="text/javascript"
    crossorigin>
</script>

<script
    src="https://www.datadoghq-browser-agent.com/us3/v6/datadog-logs.js"
    type="text/javascript"
    crossorigin>
</script>

<script
    src="https://www.datadoghq-browser-agent.com/us5/v6/datadog-logs.js"
    type="text/javascript"
    crossorigin>
</script>

<script
    src="https://www.datadoghq-browser-agent.com/datadog-logs-v6.js"
    type="text/javascript"
    crossorigin>
</script>

Paso 3 - Inicializa el SDK de registros del navegador

El SDK debe ser inicializado tan pronto como sea posible en el ciclo de vida de la aplicación. Esto asegura que todos los registros se capturen correctamente.

En el fragmento de inicialización, establece el token del cliente y el sitio. Consulta la lista completa de parámetros de inicialización.

import { datadogLogs } from '@datadog/browser-logs';

datadogLogs.init({
  clientToken: '<CLIENT_TOKEN>',
  // `site` refers to the Datadog site parameter of your organization
  // see https://docs.datadoghq.com/getting_started/site/
  site: '<DATADOG_SITE>',
  forwardErrorsToLogs: true,
  sessionSampleRate: 100,
});

<script>
  window.DD_LOGS.onReady(function() {
    window.DD_LOGS.init({
      clientToken: '<CLIENT_TOKEN>',
      // `site` refers to the Datadog site parameter of your organization
      // see https://docs.datadoghq.com/getting_started/site/
      site: '<DATADOG_SITE>',
      forwardErrorsToLogs: true,
      sessionSampleRate: 100,
    });
  })
</script>

<script>
    window.DD_LOGS && window.DD_LOGS.init({
      clientToken: '<CLIENT_TOKEN>',
      // `site` refers to the Datadog site parameter of your organization
      // see https://docs.datadoghq.com/getting_started/site/
      site: '<DATADOG_SITE>',
      forwardErrorsToLogs: true,
      sessionSampleRate: 100,
    });
</script>

Configura el consentimiento de seguimiento (cumplimiento de GDPR)

Para cumplir con GDPR, CCPA y regulaciones similares, el SDK del navegador RUM te permite proporcionar el valor de consentimiento de seguimiento en la inicialización.

Configura la Política de Seguridad de Contenidos (CSP)

Si estás utilizando la integración de Política de Seguridad de Contenidos (CSP) de Datadog en tu sitio, consulta la documentación de CSP para pasos adicionales de configuración.

Paso 4 - Visualiza tus datos

Ahora que has completado la configuración básica para los registros, tu aplicación está recopilando registros del navegador y puedes comenzar a monitorear y depurar problemas en tiempo real.

Visualiza los registros en el Explorador de registros.

Uso

Registros personalizados

Después de que el SDK de registros del navegador de Datadog esté inicializado, envía una entrada de registro personalizada directamente a Datadog con la API:

logger.debug | info | warn | error (message: string, messageContext?: Context, error?: Error)

import { datadogLogs } from '@datadog/browser-logs'

datadogLogs.logger.info('Button clicked', { name: 'buttonName', id: 123 })

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.logger.info('Button clicked', { name: 'buttonName', id: 123 })
})

window.DD_LOGS && window.DD_LOGS.logger.info('Button clicked', { name: 'buttonName', id: 123 })

Resultados

Los resultados son los mismos al usar NPM, CDN asíncrono o CDN síncrono:

{
  "status": "info",
  "session_id": "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
  "name": "buttonName",
  "id": 123,
  "message": "Button clicked",
  "date": 1234567890000,
  "origin": "logger",
  "http": {
    "useragent": "Mozilla/5.0 ...",
  },
  "view": {
    "url": "https://...",
    "referrer": "https://...",
  },
  "network": {
    "client": {
      "geoip": {...}
      "ip": "xxx.xxx.xxx.xxx"
    }
  }
}

El SDK de registros del navegador agrega la siguiente información por defecto (se pueden agregar más campos si el SDK de RUM está presente):

• date
• view.url
• view.referrer
• session_id (solo si se utiliza una sesión)

El backend de Datadog agrega más campos, como:

• http.useragent
• network.client.ip

Seguimiento de errores

El SDK de registros del navegador de Datadog permite el seguimiento manual de errores utilizando el parámetro opcional error (disponible en SDK v4.36.0+). Cuando se proporciona una instancia de un Error de JavaScript, el SDK extrae información relevante (tipo, mensaje, traza de pila) del error.

logger.{debug|info|warn|error}(message: string, messageContext?: Context, error?: Error)

import { datadogLogs } from '@datadog/browser-logs'

try {
  ...
  throw new Error('Wrong behavior')
  ...
} catch (ex) {
  datadogLogs.logger.error('Error occurred', {}, ex)
}

try {
  ...
  throw new Error('Wrong behavior')
  ...
} catch (ex) {
  window.DD_LOGS.onReady(function () {
    window.DD_LOGS.logger.error('Error occurred', {}, ex)
  })
}

try {
  ...
  throw new Error('Wrong behavior')
  ...
} catch (ex) {
    window.DD_LOGS && window.DD_LOGS.logger.error('Error occurred', {}, ex)
}

Resultados

Los resultados son los mismos al usar NPM, CDN asíncrono o CDN síncrono:

{
  "status": "error",
  "session_id": "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
  "message": "Error occurred",
  "date": 1234567890000,
  "origin": "logger",
  "error" : {
    "message": "Wrong behavior",
    "kind" : "Error",
    "stack" : "Error: Wrong behavior at <anonymous> @ <anonymous>:1:1"
  },
  ...
}

Función de logger genérica

El SDK de registros del navegador de Datadog agrega funciones abreviadas (.debug, .info, .warn, .error) a los loggers para mayor comodidad. También está disponible una función de logger genérica, que expone el parámetro status:

log(message: string, messageContext?: Context, status? = 'debug' | 'info' | 'warn' | 'error', error?: Error)

import { datadogLogs } from '@datadog/browser-logs';

datadogLogs.logger.log(<MESSAGE>,<JSON_ATTRIBUTES>,<STATUS>,<ERROR>);

window.DD_LOGS.onReady(function() {
  window.DD_LOGS.logger.log(<MESSAGE>,<JSON_ATTRIBUTES>,<STATUS>,<ERROR>);
})

window.DD_LOGS && window.DD_LOGS.logger.log(<MESSAGE>,<JSON_ATTRIBUTES>,<STATUS>,<ERROR>);

Marcadores de posición

Los marcadores de posición en los ejemplos anteriores se describen a continuación:

Uso avanzado

Eliminar datos sensibles de tus registros del navegador

Si tus registros del navegador contienen información sensible que necesita ser redactada, configura el SDK del navegador para eliminar secuencias sensibles utilizando el callback beforeSend cuando inicialices el recolector de registros del navegador.

La función de callback beforeSend se puede invocar con dos argumentos: el evento log y context. Esta función te da acceso a cada registro recopilado por el SDK del navegador antes de que se envíe a Datadog, y te permite usar el contexto para ajustar cualquier propiedad del registro. El contexto contiene información adicional relacionada con el evento, pero no necesariamente incluida en el evento. Normalmente puedes usar esta información para enriquecer tu evento o descartarlo.

function beforeSend(log, context)

Los valores potenciales context son:

Para redactar direcciones de correo electrónico de las URL de su aplicación web:

import { datadogLogs } from '@datadog/browser-logs'

datadogLogs.init({
    ...,
    beforeSend: (log) => {
        // remove email from view url
        log.view.url = log.view.url.replace(/email=[^&]*/, "email=REDACTED")
    },
    ...
});

window.DD_LOGS.onReady(function() {
    window.DD_LOGS.init({
        ...,
        beforeSend: (log) => {
            // remove email from view url
            log.view.url = log.view.url.replace(/email=[^&]*/, "email=REDACTED")
        },
        ...
    })
})

window.DD_LOGS &&
    window.DD_LOGS.init({
        ...,
        beforeSend: (log) => {
            // remove email from view url
            log.view.url = log.view.url.replace(/email=[^&]*/, "email=REDACTED")
        },
        ...
    });

Las siguientes propiedades son recopiladas automáticamente por el SDK y podrían contener datos sensibles:

Descartar registros específicos

La beforeSend función de callback también le permite descartar un registro antes de que se envíe a Datadog.

Para descartar errores de red si su estado es 404:

import { datadogLogs } from '@datadog/browser-logs'

datadogLogs.init({
    ...,
    beforeSend: (log) => {
        // discard 404 network errors
        if (log.http && log.http.status_code === 404) {
          return false
        }
    },
    ...
});

window.DD_LOGS.onReady(function() {
    window.DD_LOGS.init({
        ...,
        beforeSend: (log) => {
          // discard 404 network errors
          if (log.http && log.http.status_code === 404) {
            return false
          }
        },
        ...
    })
})

window.DD_LOGS &&
    window.DD_LOGS.init({
        ...,
        beforeSend: (log) => {
          // discard 404 network errors
          if (log.http && log.http.status_code === 404) {
            return false
          }
        },
        ...
    });

Define múltiples registradores

El SDK de registros del navegador de Datadog contiene un registrador predeterminado, pero es posible definir diferentes registradores.

Crea un nuevo registrador

Después de que el SDK de registros del navegador de Datadog esté inicializado, utiliza la API createLogger para definir un nuevo registrador:

createLogger (name: string, conf?: {
    level?: 'debug' | 'info' | 'warn' | 'error',
    handler?: 'http' | 'console' | 'silent',
    context?: Context
})

Nota: Estos parámetros se pueden establecer con las APIs setLevel, setHandler y setContext.

Obtén un registrador personalizado

Después de la creación de un registrador, accede a él en cualquier parte de tu código JavaScript con la API:

getLogger(name: string)

import { datadogLogs } from '@datadog/browser-logs'

datadogLogs.createLogger('signupLogger', {
  level: 'info',
  handler: 'http',
  context: { env: 'staging' }
})

import { datadogLogs } from '@datadog/browser-logs'

const signupLogger = datadogLogs.getLogger('signupLogger')
signupLogger.info('Test sign up completed')

window.DD_LOGS.onReady(function () {
  const signupLogger = window.DD_LOGS.createLogger('signupLogger', {
    level: 'info',
    handler: 'http',
    context: { env: 'staging' }
  })
})

window.DD_LOGS.onReady(function () {
  const signupLogger = window.DD_LOGS.getLogger('signupLogger')
  signupLogger.info('Test sign up completed')
})

if (window.DD_LOGS) {
  const signupLogger = window.DD_LOGS.createLogger('signupLogger', {
    level: 'info',
    handler: 'http',
    context: { env: 'staging' }
  })
}

if (window.DD_LOGS) {
  const signupLogger = window.DD_LOGS.getLogger('signupLogger')
  signupLogger.info('Test sign up completed')
}

Sobrescribir contexto

Contexto global

Después de que el SDK de registros del navegador de Datadog esté inicializado, es posible:

• Establecer el contexto completo para todos tus registradores con la API setGlobalContext (context: object).
• Agrega un contexto a todos tus registradores con la API setGlobalContextProperty (key: string, value: any).
• Obtén el contexto global completo con la API getGlobalContext ().
• Elimina la propiedad de contexto con la API removeGlobalContextProperty (key: string).
• Limpia todas las propiedades de contexto existentes con la API clearGlobalContext ().

El SDK del Navegador de Registros v4.17.0 ha actualizado los nombres de varias API:

• getGlobalContext en lugar de getLoggerGlobalContext
• setGlobalContext en lugar de setLoggerGlobalContext
• setGlobalContextProperty en lugar de addLoggerGlobalContext
• removeGlobalContextProperty en lugar de removeLoggerGlobalContext

import { datadogLogs } from '@datadog/browser-logs'

datadogLogs.setGlobalContext({ env: 'staging' })

datadogLogs.setGlobalContextProperty('referrer', document.referrer)

datadogLogs.getGlobalContext() // => {env: 'staging', referrer: ...}

datadogLogs.removeGlobalContextProperty('referrer')

datadogLogs.getGlobalContext() // => {env: 'staging'}

datadogLogs.clearGlobalContext()

datadogLogs.getGlobalContext() // => {}

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.setGlobalContext({ env: 'staging' })
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.setGlobalContextProperty('referrer', document.referrer)
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.getGlobalContext() // => {env: 'staging', referrer: ...}
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.removeGlobalContextProperty('referrer')
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.getGlobalContext() // => {env: 'staging'}
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.clearGlobalContext()
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.getGlobalContext() // => {}
})

window.DD_LOGS && window.DD_LOGS.setGlobalContext({ env: 'staging' })

window.DD_LOGS && window.DD_LOGS.setGlobalContextProperty('referrer', document.referrer)

window.DD_LOGS && window.DD_LOGS.getGlobalContext() // => {env: 'staging', referrer: ...}

window.DD_LOGS && window.DD_LOGS.removeGlobalContextProperty('referrer')

window.DD_LOGS && window.DD_LOGS.getGlobalContext() // => {env: 'staging'}

window.DD_LOGS && window.DD_LOGS.clearGlobalContext()

window.DD_LOGS && window.DD_LOGS.getGlobalContext() // => {}

Contexto de usuario

El SDK de registros de Datadog proporciona funciones convenientes para asociar un User con los registros generados.

• Establece el usuario para todos tus registradores con la API setUser (newUser: User).
• Agrega o modifica una propiedad de usuario en todos tus registradores con la API setUserProperty (key: string, value: any).
• Obtén el usuario almacenado actualmente con la API getUser ().
• Elimina una propiedad de usuario con la API removeUserProperty (key: string).
• Limpia todas las propiedades de usuario existentes con la API clearUser ().

Nota: El contexto de usuario se aplica antes del contexto global. Por lo tanto, cada propiedad de usuario incluida en el contexto global sobrescribirá el contexto de usuario al generar registro.

import { datadogLogs } from '@datadog/browser-logs'

datadogLogs.setUser({ id: '1234', name: 'John Doe', email: 'john@doe.com' })
datadogLogs.setUserProperty('type', 'customer')
datadogLogs.getUser() // => {id: '1234', name: 'John Doe', email: 'john@doe.com', type: 'customer'}

datadogLogs.removeUserProperty('type')
datadogLogs.getUser() // => {id: '1234', name: 'John Doe', email: 'john@doe.com'}

datadogLogs.clearUser()
datadogLogs.getUser() // => {}

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.setUser({ id: '1234', name: 'John Doe', email: 'john@doe.com' })
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.setUserProperty('type', 'customer')
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.getUser() // => {id: '1234', name: 'John Doe', email: 'john@doe.com', type: 'customer'}
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.removeUserProperty('type')
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.getUser() // => {id: '1234', name: 'John Doe', email: 'john@doe.com'}
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.clearUser()
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.getUser() // => {}
})

window.DD_LOGS && window.DD_LOGS.setUser({ id: '1234', name: 'John Doe', email: 'john@doe.com' })

window.DD_LOGS && window.DD_LOGS.setUserProperty('type', 'customer')

window.DD_LOGS && window.DD_LOGS.getUser() // => {id: '1234', name: 'John Doe', email: 'john@doe.com', type: 'customer'}

window.DD_LOGS && window.DD_LOGS.removeUserProperty('type')

window.DD_LOGS && window.DD_LOGS.getUser() // => {id: '1234', name: 'John Doe', email: 'john@doe.com'}

window.DD_LOGS && window.DD_LOGS.clearUser()

window.DD_LOGS && window.DD_LOGS.getUser() // => {}

Contexto de cuenta

El SDK de registros de Datadog proporciona funciones convenientes para asociar un Account con los registros generados.

• Establece la cuenta para todos tus registradores con la API setAccount (newAccount: Account).
• Agrega o modifica una propiedad de cuenta en todos tus registradores con la API setAccountProperty (key: string, value: any).
• Obtén la cuenta almacenada actualmente con la API getAccount ().
• Elimina una propiedad de cuenta con la API removeAccountProperty (key: string).
• Limpia todas las propiedades de cuenta existentes con la API clearAccount ().

Nota: El contexto de la cuenta se aplica antes del contexto global. Por lo tanto, cada propiedad de cuenta incluida en el contexto global sobrescribirá el contexto de cuenta al generar registros.

import { datadogLogs } from '@datadog/browser-logs'

datadogLogs.setAccount({ id: '1234', name: 'My Company Name' })
datadogLogs.setAccountProperty('type', 'premium')
datadogLogs.getAccount() // => {id: '1234', name: 'My Company Name', type: 'premium'}

datadogLogs.removeAccountProperty('type')
datadogLogs.getAccount() // => {id: '1234', name: 'My Company Name'}

datadogLogs.clearAccount()
datadogLogs.getAccount() // => {}

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.setAccount({ id: '1234', name: 'My Company Name' })
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.setAccountProperty('type', 'premium')
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.getAccount() // => {id: '1234', name: 'My Company Name', type: 'premium'}
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.removeAccountProperty('type')
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.getAccount() // => {id: '1234', name: 'My Company Name'}
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.clearAccount()
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.getAccount() // => {}
})

window.DD_LOGS && window.DD_LOGS.setAccount({ id: '1234', name: 'My Company Name' })

window.DD_LOGS && window.DD_LOGS.setAccountProperty('type', 'premium')

window.DD_LOGS && window.DD_LOGS.getAccount() // => {id: '1234', name: 'My Company Name', type: 'premium'}

window.DD_LOGS && window.DD_LOGS.removeAccountProperty('type')

window.DD_LOGS && window.DD_LOGS.getAccount() // => {id: '1234', name: 'My Company Name'}

window.DD_LOGS && window.DD_LOGS.clearAccount()

window.DD_LOGS && window.DD_LOGS.getAccount() // => {}

Ciclo de vida de los contextos

Por defecto, los contextos se almacenan en la memoria de la página actual, lo que significa que no están:

• mantenidos después de una recarga completa de la página
• compartidos entre diferentes pestañas o ventanas de la misma sesión

Para agregarlos a todos los eventos de la sesión, deben estar adjuntos a cada página.

Con la introducción de la opción de configuración storeContextsAcrossPages en la v4.49.0 del SDK del navegador, esos contextos pueden ser almacenados en localStorage, permitiendo los siguientes comportamientos:

• Los contextos se preservan después de una recarga completa
• Los contextos se sincronizan entre pestañas abiertas en el mismo origen

Sin embargo, esta función viene con algunas limitaciones:

• No se recomienda establecer Información Personal Identificable (PII) en esos contextos, ya que los datos almacenados en localStorage sobreviven a la sesión del usuario
• La función es incompatible con las opciones trackSessionAcrossSubdomains porque localStorage los datos solo se comparten entre el mismo origen (login.site.com ≠ app.site.com)
• localStorage está limitado a 5 MiB por origen, por lo que los datos específicos de la aplicación, los contextos de Datadog y otros datos de terceros almacenados en localStorage deben estar dentro de este límite para evitar problemas

Contexto del registrador

Después de que se crea un registrador, es posible:

• Establece el contexto completo para tu registrador con la API setContext (context: object).
• Establece una propiedad de contexto en tu logger con la API setContextProperty (key: string, value: any):

import { datadogLogs } from '@datadog/browser-logs'

datadogLogs.setContext("{'env': 'staging'}")

datadogLogs.setContextProperty('referrer', document.referrer)

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.setContext("{'env': 'staging'}")
})

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.setContextProperty('referrer', document.referrer)
})

window.DD_LOGS && window.DD_LOGS.setContext("{'env': 'staging'}")

window.DD_LOGS && window.DD_LOGS.setContextProperty('referrer', document.referrer)

Filtrar por estado

Después de que se inicializa el SDK de logs del navegador de Datadog, el nivel mínimo de logs para tu logger se establece con la API:

setLevel (level?: 'debug' | 'info' | 'warn' | 'error')

Solo se envían los logs con un estado igual o superior al nivel especificado.

import { datadogLogs } from '@datadog/browser-logs'

datadogLogs.logger.setLevel('<LEVEL>')

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.logger.setLevel('<LEVEL>')
})

window.DD_LOGS && window.DD_LOGS.logger.setLevel('<LEVEL>')

Cambiar el destino

Por defecto, los loggers creados por el SDK de logs del navegador de Datadog envían logs a Datadog. Después de que se inicializa el SDK de logs del navegador de Datadog, es posible configurar el logger para:

• enviar logs a console y Datadog (http)
• enviar logs solo a console
• no enviar logs en absoluto (silent)

setHandler (handler?: 'http' | 'console' | 'silent' | Array<handler>)

import { datadogLogs } from '@datadog/browser-logs'

datadogLogs.logger.setHandler('<HANDLER>')
datadogLogs.logger.setHandler(['<HANDLER1>', '<HANDLER2>'])

window.DD_LOGS.onReady(function () {
  window.DD_LOGS.logger.setHandler('<HANDLER>')
  window.DD_LOGS.logger.setHandler(['<HANDLER1>', '<HANDLER2>'])
})

window.DD_LOGS && window.DD_LOGS.logger.setHandler('<HANDLER>')
window.DD_LOGS && window.DD_LOGS.logger.setHandler(['<HANDLER1>', '<HANDLER2>'])

Consentimiento de seguimiento del usuario

Para cumplir con el GDPR, CCPA y regulaciones similares, el SDK de logs del navegador de Datadog te permite proporcionar el valor de consentimiento de seguimiento en la inicialización.

El parámetro de inicialización trackingConsent puede ser uno de los siguientes valores:

1. "granted": El SDK de logs del navegador de Datadog comienza a recopilar datos y los envía a Datadog.
2. "not-granted": El SDK de logs del navegador de Datadog no recopila ningún dato.

Para cambiar el valor de consentimiento de seguimiento después de que se inicializa el SDK de logs del navegador de Datadog, usa la llamada a la setTrackingConsent() API. El SDK de logs del navegador de Datadog cambia su comportamiento de acuerdo con el nuevo valor:

• cuando se cambia de "granted" a "not-granted", la sesión de logs se detiene y los datos ya no se envían a Datadog.
• cuando se cambia de "not-granted" a "granted", se crea una nueva sesión de logs si no hay ninguna sesión anterior activa, y la recopilación de datos se reanuda.