Next.js Discord

Discord Forum

How to handle (and log) errors in sever components

Answered
Britannia Petite posted this in #help-forum
Open in Discord
Avatar
Britannia PetiteOP
As the title says, how does one handle errors that occur in server components?

Is there a way to bypass the nextjs obfucastion and just send the error to the client?
I also need to log this error into a service like rollbar or sentry so that when errors happen I can actaully debug them.

This is what I can see in vercel logs, but how do I get this data to rollbar or similar service? the second secrenshot is about the only thing I can see there.
Image
Image
Answered by joulev
any logging libraries with support for nextjs should be able to handle this. at work i use the sentry nextjs plugin, in personal projects i use the [axiom](https://axiom.co) integration for vercel, both work well with very little configuration
View full answer

7 Replies

Avatar
joulev
1. How to bypass: you can’t.
2. For Sentry, I think you can do it with the official Sentry Next.js SDK. Not sure about Rollbar, I don’t use it.
Avatar
Britannia PetiteOP
Hey @joulev
1. okay, though so but thanks for confirming.
2. I'll try playing around with sentry.

What I have trouble understanding is how to take advantage of the digest property that next generates along side the error. would it be beneficial to finding that particular and onbfuscated error in my logs?
A further question would be how can I integrate a logging service like papertrail with next app router, or even maybe a custom one
Avatar
Red-tailed wasp
Websockets? You will have to have the ability to set a message to the client, which means they will have to open a socket to talk to your server. I do believe Websockets is the only way to do that without the user setting up a server on the client. When you make an HTTP request, the client is waiting for a response, and after that response comes back then that HTTP connection is terminated, so you have to put everything into the response, or use another messaging protocol.
Avatar
joulev
on the server log, the error will be displayed in full (not obfuscated). the obfuscation only happens in the network boundary where your backend obfuscates the error before shipping it to the client. so yes you can use the digest to look up the actual full error as long as you have the server-side error log
Avatar
Britannia PetiteOP
Makes sense, however what I'm not sure 100% about is how to go and implement sometin like pino, winston or even a custom logging solution for next with app router?
Avatar
joulev
any logging libraries with support for nextjs should be able to handle this. at work i use the sentry nextjs plugin, in personal projects i use the [axiom](https://axiom.co) integration for vercel, both work well with very little configuration
Answer
Avatar
Britannia PetiteOP
Yeah we are using rollbar and based on the docs, which only mentions the pages router, unlike the sentry docs which mentions both, I don't think rollbar can handle this. I will try deploying with sentry...

I've also tried playing around with the log drains functionality which is probably more akin to the custom approach I mentioned. basically vercel forwards logs to an endpoint where you can then store it for longer and probably filter over it better. Now I guess all i need is to make the error structure better so that it can be easily searched by digest and requestId

Anyway going to try sentry first, thx 🙂