honeybadger-io/nextjs-with-honeybadger

This is an example of how to use Honeybadger to catch & report errors on both client + server side in Next.js.

nextjs-with-honeybadger's Issues

Server-side source maps

We currently support client-side source maps, but not server-side. Since honeybadger.js is now universal, I'd like to be able to support server-side source maps. Adding this issue here since Next.js is where this feature is most requested.

Server-side exceptions are not recorded when deployed to Vercel

When I deploy to Vercel, I can't get server-side errors to show up in Honeybadger. All the server pages give me a 404. The Vercel log looks like this:

So it appears that the function is getting called and erroring as I'd expect (500) but then displaying a 404. I don't yet understand why the "Edge Status" differs from the "Function Status".

I did confirm that there's nothing wrong with the routing, by adding another page within the /server folder that does not throw an error. That page loads fine on Vercel, so it's definitely related to error handling and not a true 404.

_error.js is getting called, however it's getting called for the 404, not the 500. The err object is null.

Based on comments from @subzero10 I do not think these Vercel issues are new.

Unexpected unhandled promise rejections

This issue relates to the universal branch of nextjs-with-honeybadger and the current 3.0.0-alpha release of honeybadger-js.

Steps to reproduce:

You will need to sign up for a free Honeybadger.io account to get an API key: https://www.honeybadger.io/plans/

1. git clone [email protected]:honeybadger-io/nextjs-with-honeybadger.git
2. cd nextjs-with-honeybadger && git checkout universal
3. npm install
4. HONEYBADGER_API_KEY=key npm run build
5. npm run start
6. Visit http://localhost:3000/
7. Click the first "Perform client side navigation" under "Client exceptions" to generate the error "Client Test 1". (other errors have this issue too, however)

Expected result: a single "Client Test 1" error is reported to Honeybadger.

Actual result: the first expected error is reported, but an "UnhandledPromiseRejectionWarning" error is also reported.

I want to understand why these duplicate reports are happening and what the idiomatic Next.js solution is. Happy to answer any questions you may have. If this is something that you can debug, email me with your hourly rate and anything else I should know about your work (josh at honeybadger.io). Thanks!

[nextjs-with-honeybadger/production] Error: Server Test 1

Backtrace

View full backtrace and more info at honeybadger.io

Nextjs server side rendering deployed on custom server

We deploy the app not in Vercel but in our own custom server. I tried your project and i saw that server side source maps still don't work. I checked the issue and the solutions suggested there, but it seems that it doesn't work

Also it seems that for client error handling to work properly NEXT_PUBLIC_HONEYBADGER_API_KEY should be set instead of HONEYBADGER_API_KEY. Otherwise [Honeybadger] Unable to send error report: no API key has been configured is being displayed in console

Use `@honeybadger-io/react` instead of `@honeybadger-io/js`

The js package may create confusion with users that come to see an example setup, as they are expecting to see the react package.

Update example app to use @honeybadger-io/nextjs

Update repo to use the new Next.js dedicated package.

App directory support

A few days ago, nextJS set app directory as stable version. Currently honeybadger is not working properly with this. Will you update it?

Add API/serverless routes examples

See here:

https://vercel.com/docs/serverless-functions/introduction#deploying-serverless-functions