使用 Asp.net Core 诊断 Angular4 服务器端渲染的问题

Question

我们使用带有服务器端渲染 (JavaScriptServices) 的 Angular dotnet 模板开始我们的项目。
我们有时会在 Angular4 的服务器端呈现超时，并且没有太多异常可以帮助我们诊断问题，特别是如果在客户端呈现上一切正常。
在服务器端运行时，有没有办法访问 TS/JS 代码的控制台日志？
或者一种获取错误调用堆栈的方法？因为我们只收到一条消息，而没有任何关于它发生在哪里的信息。

我尝试使用these instructions 附加调试器，但出现错误：

InvalidOperationException：Node.js 进程初始化失败： 警告：这是一项实验性功能，可能随时更改。

Answer 1

一方面，您有两篇关于该主题的好文章，您可能已经看过：

• https://github.com/aspnet/JavaScriptServices/tree/dev/src/Microsoft.AspNetCore.SpaServices#debugging-your-javascripttypescript-code-when-it-runs-on-the-server

• https://blogs.msdn.microsoft.com/webdev/2017/02/14/building-single-page-applications-on-asp-net-core-with-javascriptservices/

另一方面，这个问题可能会给您带来如何解决问题的想法，也许您需要在启动类中配置一些中间件，例如 Webpack 或 NodeServices：

• https://github.com/aspnet/JavaScriptServices/issues/144

我希望这个重点是正确的。

胡安

Answer 2

您发布的链接是处理诊断的一种方式，我们将JSNLog 用于我们的应用程序。

在您的 Angular 2+ 应用程序中安装 JSNLog

在命令行中，安装 NPM 包：

npm install jsnlog --save

向服务器发送未捕获的 JavaScript 异常

未捕获的异常只是您自己的代码未捕获的异常。您需要将这些记录到服务器。

默认情况下，Angular 通过向控制台发送错误消息来处理未捕获的异常（详情）。要更改这一点，您需要为 ErrorHandler 接口创建一个提供程序（示例）。

1. 在您喜欢的编辑器中打开您的主模块。这是最常见的 称为 app.module.ts。

2. 在模块定义之上，添加一个未捕获的异常处理程序 使用 JSNLog 将 JavaScript 异常记录到服务器：

    export class UncaughtExceptionHandler implements ErrorHandler {  handleError(error: any) {
          JL().fatalException('Uncaught Exception', error);
      } }
   
    // Existing module definition @NgModule({
      ...
   

3. TypeScript 编译器会报错，因为你还没有导入 JSNLog 和 ErrorHandler。现在就这样做：

   // ... 其他导入 ...

   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 }
       ],
       ...
   }) 
   

更多信息请参考this