Integrations | Sentry for Next.js

Source URL: https://docs.sentry.io/platforms/javascript/guides/nextjs/configuration/integrations

Integrations | Sentry for Next.js

The Sentry SDK uses integrations to hook into the functionality of popular libraries to automatically instrument your application and give you the best data out of the box.

Integrations automatically add error instrumentation, performance instrumentation, and/or extra context information to your application. Some are enabled by default, but you can disable them or modify their settings.

Next.js can operate within three runtimes: the Node.js.js runtime, the browser runtime, and the Edge runtime. However, it’s important to note that not all integrations are compatible with all of these runtimes.

Depending on whether an integration enhances the functionality of a particular runtime, such as the BrowserTracing integration for the browser runtime or the RequestData integration for the Node.js.js runtime, you can only include these integrations in their respective configuration files:

• For the browser runtime, add integrations to instrumentation-client.(js|ts).
• For Node.js.js, add integrations to your Sentry setup in instrumentation.(js|ts).
• For the Edge runtime, add integrations to your Sentry setup in instrumentation.(js|ts).

• Common Integrations

	Auto Enabled	Errors	Tracing	Additional Context
dedupeIntegration	✓	✓
functionToStringIntegration	✓
inboundFiltersIntegration	✓	✓
linkedErrorsIntegration	✓	✓
captureConsoleIntegration				✓
extraErrorDataIntegration				✓
rewriteFramesIntegration		✓

• Browser Integrations

	Auto Enabled	Errors	Tracing	Replay	Additional Context
breadcrumbsIntegration	✓				✓
browserApiErrorsIntegration	✓	✓
browserSessionIntegration	✓				✓
browserTracingIntegration	✓		✓		✓
globalHandlersIntegration	✓	✓
httpContextIntegration	✓				✓
browserProfilingIntegration			✓
contextLinesIntegration		✓
featureFlagsIntegration					✓
graphqlClientIntegration					✓
httpClientIntegration		✓
launchDarklyIntegration					✓
moduleMetadataIntegration					✓
openFeatureIntegration					✓
replayCanvasIntegration				✓
replayIntegration				✓	✓
reportingObserverIntegration		✓
statsigIntegration					✓
supabaseIntegration		✓	✓
unleashIntegration					✓

• Server (Node.js, Edge) Integrations

	Auto Enabled	Errors	Tracing	Additional Context
requestDataIntegration	✓		✓

• Node.js Integrations

	Auto Enabled	Errors	Tracing	Additional Context
amqplibIntegration	✓		✓
consoleIntegration	✓			✓
contextLinesIntegration	✓	✓
genericPoolIntegration	✓		✓
graphqlIntegration	✓		✓
httpIntegration	✓	✓	✓	✓
kafkaIntegration	✓		✓
lruMemoizerIntegration	✓		✓
modulesIntegration	✓			✓
mongoIntegration	✓		✓
mongooseIntegration	✓		✓
mysqlIntegration	✓		✓
mysql2Integration	✓		✓
nodeContextIntegration	✓			✓
nativeNodeFetchIntegration	✓		✓	✓
onUncaughtExceptionIntegration	✓	✓
onUnhandledRejectionIntegration	✓	✓
postgresIntegration	✓		✓
redisIntegration	✓		✓
requestDataIntegration	✓		✓
tediousIntegration	✓		✓
dataloaderIntegration	✓		✓
childProcessIntegration	✓			✓
prismaIntegration	✓		✓
anrIntegration		✓
eventLoopBlockIntegration		✓
extraErrorDataIntegration				✓
fsIntegration			✓
knexIntegration			✓
localVariablesIntegration		✓
nodeProfilingIntegration			✓
trpcMiddleware		✓	✓	✓
vercelAiIntegration	✓		✓	✓
openAIIntegration	✓		✓
anthropicAIIntegration	✓	✓	✓
googleGenAIIntegration	✓	✓	✓
langChainIntegration	✓	✓	✓
zodErrorsIntegration				✓
pinoIntegration		✓

• Edge Integrations

	Auto Enabled	Errors	Tracing	Additional Context
winterCGFetchIntegration	✓		✓	✓
vercelAiIntegration			✓

Modifying Default Integrations

To disable system integrations, set defaultIntegrations: false when calling init().

To override their settings, provide a new instance with your config to the integrations option. For example, to turn off browser capturing console calls:

Sentry.init({
  dsn: "___PUBLIC_DSN___",

  integrations: [
    Sentry.breadcrumbsIntegration({
      console: false,
    }),
  ],

});

Adding an Integration

You can add additional integrations in your init call:

import * as Sentry from "@sentry/browser";

Sentry.init({
  dsn: "___PUBLIC_DSN___",
  integrations: [Sentry.reportingObserverIntegration()],
});

Alternatively, you can add integrations via Sentry.addIntegration(). This is useful if you only want to enable an integration in a specific environment or if you want to load an integration later. For all other cases, we recommend you use the integrations option.

import * as Sentry from "@sentry/browser";

Sentry.init({
  integrations: [],
});

Sentry.addIntegration(Sentry.reportingObserverIntegration());

Lazy Loading Integrations

Lazy-loading lets you add pluggable integrations without increasing the initial bundle size. You can do this in two ways:

• 1. Dynamic Import (recommended)

You can add the integration with a dynamic import using import(). This method loads the integration from the npm package. To avoid running into issues with import(), you should use a bundler that supports dynamic imports. If you’re using a tool like Vite for your project, the bundling process is probably already set up.

instrumentation-client.ts

Sentry.init({
  // Note, Replay is NOT instantiated below:
  integrations: [],
});

Then, somewhere in your application, for example in a useEffect hook, you can lazy-load the Replay integration:

import("@sentry/nextjs").then((lazyLoadedSentry) => {
  Sentry.addIntegration(lazyLoadedSentry.replayIntegration());
});

• 2. Load from CDN with lazyLoadIntegration()

You can also lazy-load pluggable integrations via Sentry.lazyLoadIntegration(). This will attempt to load the integration from the Sentry CDN. Note that this function will reject if it fails to load the integration from the Sentry CDN, which can happen if a user has an ad-blocker or if there’s a network problem. You should always make sure that rejections are handled for this function in your application.

async function loadHttpClient() {
  const httpClientIntegration = await Sentry.lazyLoadIntegration(
    "httpClientIntegration",
  );
  Sentry.addIntegration(httpClientIntegration());
}

Lazy loading is available for the following integrations:

• replayIntegration
• replayCanvasIntegration
• feedbackIntegration
• feedbackModalIntegration
• feedbackScreenshotIntegration
• captureConsoleIntegration
• contextLinesIntegration
• linkedErrorsIntegration
• dedupeIntegration
• extraErrorDataIntegration
• httpClientIntegration
• reportingObserverIntegration
• rewriteFramesIntegration
• browserProfilingIntegration

Removing a Default Integration

If you only want to remove a single or some of the default integrations, instead of disabling all of them with defaultIntegrations: false, you can use the following syntax to filter out the ones you don’t want.

This example removes the integration for adding breadcrumbs to the event, which is enabled by default:

Sentry.init({
  // ...
  integrations: function (integrations) {
    // integrations will be all default integrations
    return integrations.filter(function (integration) {
      return integration.name !== "Breadcrumbs";
    });
  },
});

Custom Integrations

You can also create custom integrations.

Available Integrations

• RequestData

  Adds data from incoming requests to transaction and error events that occur during request handling done by the backend. (default)

• Amqplib

  Adds instrumentation for Amqplib. (default)

• Anr

  Capture events when the event loop is blocked and the application is no longer responding.

• Anthropic

  Adds instrumentation for the Anthropic SDK.

• Breadcrumbs

  Wraps native browser APIs to capture breadcrumbs. (default)

• BrowserApiErrors

  Wraps native time and events APIs (`setTimeout`, `setInterval`, `requestAnimationFrame`, `addEventListener/removeEventListener`) in `try/catch` blocks to handle async exceptions. (default)

• BrowserProfiling

  Capture profiling data for the Browser.

• BrowserSession

  Track healthy Sessions in the Browser.

• BrowserTracing

  Capture performance data for the Browser.

• CaptureConsole

  Captures all Console API calls via `captureException` or `captureMessage`.

• Child Process Integration

  Adds instrumentation for child processes and worker threads (default)

• Console

  Capture console logs as breadcrumbs. (default)

• Context

  Capture context about the environment and the device that the client is running on, and add it to events. (default)

• ContextLines

  Adds source code from inline JavaScript of the current page’s HTML.

• Dataloader

  Adds instrumentation for Dataloader.

• Dedupe

  Deduplicate certain events to avoid receiving duplicate errors. (default)

• Event Loop Block

  Monitor for blocked event loops in all threads of a Node.js application.

• ExtraErrorData

  Extracts all non-native attributes from the error object and attaches them to the event as extra data.

• FileSystem

  Adds instrumentation for filesystem operations.

• FunctionToString

  Allows the SDK to provide original functions and method names, even when those functions or methods are wrapped by our error or breadcrumb handlers. (default)

• Generic Feature Flags Integration

  Learn how to attach custom feature flag data to Sentry error events.

• Generic Pool

  Adds instrumentation for Generic Pool. (default)

• GlobalHandlers

  Attaches global handlers to capture uncaught exceptions and unhandled rejections. (default)

• Google Gen AI

  Adds instrumentation for Google Gen AI SDK.

• GraphQL

  Adds instrumentation for GraphQL. (default)

• GraphQLClient

  Enhance spans and breadcrumbs with data from GraphQL requests.

• Http

  Capture spans & breadcrumbs for http requests. (default)

• HttpClient

  Captures errors on failed requests from Fetch and XHR and attaches request and response information.

• HttpContext

  Attaches HTTP request information, such as URL, user-agent, referrer, and other headers to the event. (default)

• InboundFilters

  Allows you to ignore specific errors based on the type, message, or URLs in a given exception. (default)

• Kafka

  Adds instrumentation for KafkaJS. (default)

• Knex

  Adds instrumentation for Knex.

• LangChain

  Adds instrumentation for LangChain.

• LangGraph

  Adds instrumentation for the LangGraph SDK.

• LaunchDarkly

  Learn how to use Sentry with LaunchDarkly.

• LinkedErrors

  Allows you to configure linked errors. (default)

• LocalVariables

  Add local variables to exception frames. (default)

• LRU Memoizer

  Adds instrumentation for LRU Memoizer. (default)

• ModuleMetadata

  Adds module metadata to stack frames.

• Modules

  Add node modules / packages to the event. (default)

• MongoDB

  Adds instrumentation for MongoDB. (default)

• Mongoose

  Adds instrumentation for Mongoose. (default)

• MySQL

  Adds instrumentation for MySQL. (default)

• MySQL2

  Adds instrumentation for MySQL2. (default)

• NodeFetch

  Capture spans & breadcrumbs for node fetch requests. (default)

• NodeProfiling

  Capture profiling data for Node.js applications.

• OnUncaughtException

  Registers handlers to capture global uncaught exceptions. (default)

• OnUnhandledRejection

  Registers handlers to capture global unhandled promise rejections. (default)

• OpenAI

  Adds instrumentation for the OpenAI SDK.

• OpenFeature

  Learn how to use Sentry with OpenFeature.

• Pino

  Capture logs and errors from Pino.

• Postgres

  Adds instrumentation for Postgres. (default)

• Prisma

  Adds instrumentation for Prisma. (default)

• Redis

  Adds instrumentation for Redis. (default)

• Replay

  Capture a video-like reproduction of what was happening in the user’s browser.

• ReplayCanvas

  Capture session replays from HTML canvas elements.

• ReportingObserver

  Captures the reports collected via the `ReportingObserver` interface and sends them to Sentry.

• RewriteFrames

  Allows you to apply a transformation to each frame of the stack trace.

• Statsig

  Learn how to use Sentry with Statsig.

• Supabase

  Adds instrumentation for Supabase client operations.

• Tedious

  Adds instrumentation for Tedious. (default)

• trpcMiddleware

  Capture spans & errors for tRPC handlers.

• Unleash

  Learn how to use Sentry with Unleash.

• Vercel AI

  Adds instrumentation for Vercel AI SDK.

• WebWorker

  Connect Web Workers with the SDK running on the main thread

• WinterCGFetch

  Creates spans and attaches tracing headers to fetch requests on edge runtimes. (default)

• ZodErrors

  Adds additional data to Zod validation errors.

Pages in this section

• RequestData
• Amqplib
• Anr
• Anthropic
• Breadcrumbs
• BrowserApiErrors
• BrowserProfiling
• BrowserSession
• BrowserTracing
• CaptureConsole
• Child Process Integration
• Console
• Context
• ContextLines
• Dataloader
• Dedupe
• Event Loop Block
• ExtraErrorData
• FileSystem
• FunctionToString
• Generic Feature Flags Integration
• Generic Pool
• GlobalHandlers
• Google Gen AI
• GraphQL
• GraphQLClient
• Http
• HttpClient
• HttpContext
• InboundFilters
• Kafka
• Knex
• LangChain
• LangGraph
• LaunchDarkly
• LinkedErrors
• LocalVariables
• LRU Memoizer
• ModuleMetadata
• Modules
• MongoDB
• Mongoose
• MySQL
• MySQL2
• NodeFetch
• NodeProfiling
• OnUncaughtException
• OnUnhandledRejection
• OpenAI
• OpenFeature
• Pino
• Postgres
• Prisma
• Prisma
• Redis
• Replay
• ReplayCanvas
• ReportingObserver
• RewriteFrames
• Statsig
• Supabase
• Tedious
• trpcMiddleware
• Unleash
• Vercel AI
• WebWorker
• WinterCGFetch
• ZodErrors
• Custom Integrations