diff --git a/pages/_error.js b/pages/_error.js new file mode 100644 index 0000000..083222a --- /dev/null +++ b/pages/_error.js @@ -0,0 +1,65 @@ +import NextErrorComponent from 'next/error'; + +import * as Sentry from '@sentry/nextjs'; + +const MyError = ({ statusCode, hasGetInitialPropsRun, err }) => { + if (!hasGetInitialPropsRun && err) { + // getInitialProps is not called in case of + // https://github.com/vercel/next.js/issues/8592. As a workaround, we pass + // err via _app.js so it can be captured + Sentry.captureException(err); + // Flushing is not required in this case as it only happens on the client + } + + return ; +}; + +MyError.getInitialProps = async (context) => { + const errorInitialProps = await NextErrorComponent.getInitialProps(context); + + const { res, err, asPath } = context; + + // Workaround for https://github.com/vercel/next.js/issues/8592, mark when + // getInitialProps has run + errorInitialProps.hasGetInitialPropsRun = true; + + // Returning early because we don't want to log 404 errors to Sentry. + if (res?.statusCode === 404) { + return errorInitialProps; + } + + // Running on the server, the response object (`res`) is available. + // + // Next.js will pass an err on the server if a page's data fetching methods + // threw or returned a Promise that rejected + // + // Running on the client (browser), Next.js will provide an err if: + // + // - a page's `getInitialProps` threw or returned a Promise that rejected + // - an exception was thrown somewhere in the React lifecycle (render, + // componentDidMount, etc) that was caught by Next.js's React Error + // Boundary. Read more about what types of exceptions are caught by Error + // Boundaries: https://reactjs.org/docs/error-boundaries.html + + if (err) { + Sentry.captureException(err); + + // Flushing before returning is necessary if deploying to Vercel, see + // https://vercel.com/docs/platform/limits#streaming-responses + await Sentry.flush(2000); + + return errorInitialProps; + } + + // If this point is reached, getInitialProps was called without any + // information about what the error might be. This is unexpected and may + // indicate a bug introduced in Next.js, so record it in Sentry + Sentry.captureException( + new Error(`_error.js getInitialProps missing data at path: ${asPath}`), + ); + await Sentry.flush(2000); + + return errorInitialProps; +}; + +export default MyError; diff --git a/sentry.client.config.js b/sentry.client.config.js new file mode 100644 index 0000000..09f7c52 --- /dev/null +++ b/sentry.client.config.js @@ -0,0 +1,17 @@ +// This file configures the initialization of Sentry on the browser. +// The config you add here will be used whenever a page is visited. +// https://docs.sentry.io/platforms/javascript/guides/nextjs/ + +import * as Sentry from '@sentry/nextjs'; + +const SENTRY_DSN = process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN; + +Sentry.init({ + dsn: SENTRY_DSN, + // Adjust this value in production, or use tracesSampler for greater control + tracesSampleRate: 1.0, + // ... + // Note: if you want to override the automatic release value, do not set a + // `release` value here - use the environment variable `SENTRY_RELEASE`, so + // that it will also get attached to your source maps +}); diff --git a/sentry.server.config.js b/sentry.server.config.js new file mode 100644 index 0000000..990cf22 --- /dev/null +++ b/sentry.server.config.js @@ -0,0 +1,17 @@ +// This file configures the initialization of Sentry on the server. +// The config you add here will be used whenever the server handles a request. +// https://docs.sentry.io/platforms/javascript/guides/nextjs/ + +import * as Sentry from '@sentry/nextjs'; + +const SENTRY_DSN = process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN; + +Sentry.init({ + dsn: SENTRY_DSN, + // Adjust this value in production, or use tracesSampler for greater control + tracesSampleRate: 1.0, + // ... + // Note: if you want to override the automatic release value, do not set a + // `release` value here - use the environment variable `SENTRY_RELEASE`, so + // that it will also get attached to your source maps +});