.NET Core Angular 7 服务器端渲染

Question

我正在尝试使用dotnet core托管Angular 7 SSR，而默认模板使用的是Angular 5，并且微软有相关文档可以让SSR在Angular 5上运行（这个也能正常工作）。我尝试通过命令行升级到Angular 7并启动一个新的Angular项目并实现SSR，但我总是遇到同样的问题。从命令行中，ng build和ng build:SSR都能正常工作，但当我在VS中运行时，会超时（我认为这与问题无关），然后抛出以下错误：

The thread 0x6608 has exited with code 0 (0x0).
The thread 0x1134 has exited with code 0 (0x0).
The thread 0x54bc has exited with code 0 (0x0).

我从NG5 SSR (https://go.microsoft.com/fwlink/?linkid=864501) 开始做了一些改变，参考了这个（https://github.com/aspnet/Templating/issues/593），具体如下：

startup.cs

options.BootModulePath = $"{spa.Options.SourcePath}/dist-server/main.bundle.js";

到

options.BootModulePath = $"{spa.Options.SourcePath}/dist-server/main.js";

将SSR项目重新添加到 angular.json 中

 "ssr": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:server",
          "options": {
            "outputPath": "dist-server",
            "main": "src/main.server.ts",
            "tsConfig": "src/tsconfig.server.json"
          },
          "configurations": {
            "production": {
              "optimization": false,
              "outputHashing": "media",
              "sourceMap": false,
              "namedChunks": false,
              "extractLicenses": true,
              "vendorChunk": false,
              "bundleDependencies": "all",
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ]
            }
          }
        }
      }
    }

在package.json脚本中更改build:ssr

"build:ssr": "ng build --configuration=production --project=ssr",

我正在运行的代码 - https://github.com/TPJ11/DotnetNG7SSR

有人知道我做错了什么吗？感觉我一直在这个问题上碰壁 :(

- Thomas James

---

首先，“线程0x6608已退出，代码为0（0x0）。”不是错误。它只意味着工作线程已完成，这是正常的日志记录。 - wannadream

什么是second？哈哈 - Adam Vincent

然而奇怪的是，当它工作时（NG5 SSR），我从未立即收到线程消息，一旦我看到它，我知道它会失败。更多细节-它可以正确启动 .net core IIS express 服务器，也可以正常启动angular节点服务器（ng serve），然后运行**ng build --configuration=production --project=ssr "--watch"**，之后就会出现线程消息，但是如果我在命令行中运行该命令则可以正常工作。 - Thomas James

Answer 1

好的，不确定是什么导致了应用程序出错，但我有一个解决方法。

1）创建一个新的.Net Core NG应用程序并删除ClientApp文件夹，然后通过CMD创建一个名为ClientApp的空白Angular 7应用程序ng new ClientApp

2）按照Angular SSR设置指南的步骤3操作。

3）安装aspnet-prerendering npm i aspnet-prerendering

4）将步骤2c（main.server.ts）中的代码替换为Microsoft设置指南中main.server.ts的代码

5）打开angular.json文件，并将构建的outputPath更改为dist，服务器的outputPath更改为dist-server

6）打开package.json文件，在scripts中添加"build:ssr": "ng run ClientApp:server"

7）打开tsconfig.server.json和tsconfig.app.json文件，将types更改为包括node"types": ["node"]

8）打开Startup.cs，并按照Microsoft设置指南中的示例添加

spa.UseSpaPrerendering(options =>
{
    options.BootModulePath = $"{spa.Options.SourcePath}/dist-server/main.js";
        options.BootModuleBuilder = env.IsDevelopment()
            ? new AngularCliBuilder(npmScript: "build:ssr")
                : null;
    options.ExcludeUrls = new[] { "/sockjs-node" };
});

- Thomas James

---

请问能否进一步详细说明第2步和第4步？因为那些链接的文档可能已经变化，不太符合你所列出的步骤。谢谢！ - Amthieu

Answer 2

我按照以下步骤操作，至少第一次运行正常。

• 使用CLI或Visual Studio创建一个新的.net core项目
• 用来自此项目的ClientApp替换完整的ClientApp文件夹- https://github.com/joshberry/dotnetcore-angular-ssr

• 修改Startup.cs以使用SSR

  spa.UseSpaPrerendering(options =>
          {
              options.BootModulePath = $"{spa.Options.SourcePath}/dist-server/main.js";
                  options.BootModuleBuilder = env.IsDevelopment()
                      ? new AngularCliBuilder(npmScript: "build:ssr")
                          : null;
              options.ExcludeUrls = new[] { "/sockjs-node" };
          });
  

- vinayak hegde