/blog/posts/20200904-ErrorHandlingInNuxtjs.html

[damirarh]

Imported

URL: https://www.damirscorner.com/blog/posts/20200904-ErrorHandlingInNuxtjs.html

[damirarh]

Imported comment written by Patm74 on 2020-10-29T19:47:23

Hi, we are trying to implement this but it is not working at all fur us.
Will what you are explaining also report the error that happens in the nuxt server side part? The code that runs in Nodejs?

[damirarh]

Imported comment written by José Rojas Villar on 2020-10-30T21:23:43

I am trying to implement a Middleware error to catch server console errors, I can get by the error caught about this method
errorMiddleware (application) {
app.use ((error, _req, _res, next) => {
if (error) {
console.log ("Logged in errorMiddleware", error);
}
next (error);
});
but the real error caused is not returning me
How can I get a more detail info about these errors?
I was able to test the rendered errors from the test repository
@Component({
errorCaptured (this: SafeLayout, err: Error, vm: Vue, info: string) {
this.renderError = info === "render"; // indicates a template rendering error
console.log ("error handled in layout", err, vm, info);
false return; // prevent the error from spreading further
},
})
but I have not been able to implement it within my project, is there a specific configuration for this? always returns the default nuxt error, not the one set for this page.
Please can you help me.

[damirarh]

Imported comment written by Damir Arh on 2020-11-01T19:06:46

I don't know why the actual error wouldn't be logged in middleware,
especially since you're passing the error object to the log method, not
serializing it. You might want to take a look at my blogpost
about the issues with serializing the Error object in JavaScript if
that could be affecting you.

The errorCaptured handler will handle only errors in components rendered
inside the component where it implemented. That's why I implemented it as a
layout. There's no special configuration needed. If you want to check
for yourself, you can look at individual commits. The first commit
contains only the initial project as generated by nuxt CLI.

[damirarh]

Imported comment written by Damir Arh on 2020-11-01T19:07:43

The part that I'm referring to as SSR in the post is about the code running on the server side in Node.js.

As I mention in the text and as evident from the chart, there's no way to prevent the error page from showing for unhandled errors on server. You can only capture them and log them in error middleware. And customize the error page. For a better user experience you will probably want to handle all the errors at their source and rely on the error page as a last resort.

You cat take a look at the sample code on GitHub. It includes all the error handling described in this post and also throws errors to trigger them. You can look at individual commits for short descriptions of each one and related code.