Datadog Logs

Overview

This Nuxt plugin integrates Datadog Browser Logs into the application to monitor frontend behavior, console logs, and JavaScript errors. It respects the runtime environment and cookie consent before initializing and sending data.

Features

• Initializes Datadog logs only in non-local environments.
• Logs errors and console outputs to Datadog.
• Captures user context (ID, name, email) if the user is authenticated.
• Adds the current host as global context.
• Debug flags integrated for local verification.
• Graceful error handling during plugin initialization.

Runtime Configuration

The plugin relies on the following public runtime config variables:

Initialization Logic

if (config.public.appEnvironment === 'local' || !config.public.ddClientToken) {
  return false;
}

• Only initializes if:
  • The environment is not local.
  • A valid ddClientToken is provided.

Datadog SDK Configuration

const options = {
  clientToken: config.public.ddClientToken,
  site: 'datadoghq.eu',
  version: config.public.version,
  env: config.public.appEnvironment,
  service: 'eu24-web',
  forwardErrorsToLogs: true,
  forwardConsoleLogs: 'all',
  sessionSampleRate: 100
};

• forwardConsoleLogs: 'all': Captures all logs (log, info, warn, error).
• sessionSampleRate: 100: Captures logs for all sessions (100%).

Global & User Context

Host Context

datadogLogs.setGlobalContext({
  host: url.host,
});

Authenticated User Context

if (authStore.is_authenticated) {
  datadogLogs.setUser({
    id: authStore.user.id,
    email: authStore.user.email,
    name: `${authStore.user.first_name} ${authStore.user.last_name}`,
  });
}

• Sets user info in logs only if authenticated.

Debug Mode

If appDebug is true:

debugStore.services.dataDogBrowserLogs.enabled = true;
debugStore.services.dataDogBrowserLogs.clientToken = config.public.ddClientToken;

• Useful for internal QA/debugging to verify that Datadog is initialized.

Error Handling

If the Datadog SDK initialization fails, it falls back to a custom error service:

customClientErrorHandler(
  e,
  'high',
  'Datadog Log Plugin Error - trying to monitoring services using datadog log',
  errorMeta
);

• Helps track SDK load failures with high severity.

Example Usage

Datadog logs are initialized automatically by the plugin. To log custom data:

const nuxtApp = useNuxtApp();
nuxtApp.$ddLogs.logger.info("User visited checkout page", {
  page: "checkout",
  timestamp: Date.now()
});

Notes

• This plugin is client-side only.
• Works in environments like staging and production, not local.
• Auth and cookie consent logic should be in place to comply with privacy policies.