Diagnosing problems on Angular4 server side rendering with Asp.net Core

user_44547 0
Viewed 395

We started our project with dotnet template for Angular with server side rendering (JavaScriptServices).
We sometimes get timeouts on the server side rendering of Angular4 and there isn't much on the exception to help us diagnose the problem, specially if all works well on the client side rendering.
Is there a way to access the console logs for the TS/JS code when running on the server side?
Or a way to get the call stack of the error? As we only get a message without any information of where it happens.

I tried to attach a debugger using these instructions but I get the error:

InvalidOperationException: The Node.js process failed to initialize: Warning: This is an experimental feature and could change at any time.

angular-universal angular asp.net-core diagnostics
2 Answers

On the one hand here you have two good articles about the topic that probably you have already seen:

And on the other this question might bring you ideas on how to approach the problem, maybe you need to configure some Middleware in your start up class like Webpack or NodeServices:

I hope this focus in the right direction.

Juan

user_36998300

From the link you posted is one way of handling diagnostics , We use JSNLog for our Applications .

Install JSNLog in your Angular 2+ application

On the command line, install the NPM package:

npm install jsnlog --save

Send uncaught JavaScript exceptions to the server

An uncaught exception is simply an exception that isn't caught by your own code. You will want to log those to the server.

By default, Angular handles uncaught exceptions by sending error messages to the console (details). To change this, you create a provider for the ErrorHandler interface (example).

  1. Open your main module in your favorite editor. This is most often called app.module.ts.

  2. Above the module definition, add an uncaught exception handler that uses JSNLog to log the JavaScript exception to the server:

     export class UncaughtExceptionHandler implements ErrorHandler {  handleError(error: any) {
       JL().fatalException('Uncaught Exception', error);
   } }

 // Existing module definition @NgModule({
   ...

  3. The TypeScript compiler will complain, because you haven't imported JSNLog and ErrorHandler. Do that now:

    // ... other imports ...

    import { JL } from 'jsnlog';

import { ErrorHandler } from '@angular/core';
Finally add your uncaught exception handler to the providers list, as a provider for the ErrorHandler interface:
@NgModule({
    ...
    providers: [
        ...
        { provide: ErrorHandler, useClass: UncaughtExceptionHandler }
    ],
    ...
})

For more info refer this

user_36908460
Related