c# - TimeoutException : The Angular CLI process did not start listening for requests within the timeout period of 0 seconds

Question

升级到angular 9后出现此错误。我正在使用Visual Studio 2019，带有angular的ASP .NET Core。即使我创建新项目并将angular更新到9版本，它也会停止工作。

页面响应的完整列表为:

TimeoutException: The Angular CLI process did not start listening for requests within the timeout period of 0 seconds. Check the log output for error information. Microsoft.AspNetCore.SpaServices.Extensions.Util.TaskTimeoutExtensions.WithTimeout(Task task, TimeSpan timeoutDelay, string message) Microsoft.AspNetCore.SpaServices.Extensions.Proxy.SpaProxy.PerformProxyRequest(HttpContext context, HttpClient httpClient, Task baseUriTask, CancellationToken applicationStoppingToken, bool proxy404s) Microsoft.AspNetCore.Builder.SpaProxyingExtensions+<>c__DisplayClass2_0+<b__0>d.MoveNext() Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.Invoke(HttpContext context)

我的package.json是:

{
  "name": "webapplication10",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "build:ssr": "ng run WebApplication10:server:dev",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "9.0.0",
    "@angular/cdk": "~9.0.0",
    "@angular/common": "9.0.0",
    "@angular/compiler": "9.0.0",
    "@angular/core": "9.0.0",
    "@angular/forms": "9.0.0",
    "@angular/material": "~9.0.0",
    "@angular/platform-browser": "9.0.0",
    "@angular/platform-browser-dynamic": "9.0.0",
    "@angular/platform-server": "9.0.0",
    "@angular/router": "9.0.0",
    "@nguniversal/module-map-ngfactory-loader": "8.1.1",
    "aspnet-prerendering": "^3.0.1",
    "bootstrap": "^4.4.1",
    "core-js": "^3.6.4",
    "jquery": "3.4.1",
    "oidc-client": "^1.10.1",
    "popper.js": "^1.16.1",
    "rxjs": "^6.5.4",
    "tslib": "^1.10.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.900.1",
    "@angular/cli": "9.0.1",
    "@angular/compiler-cli": "9.0.0",
    "@angular/language-service": "9.0.0",
    "@types/jasmine": "^3.5.3",
    "@types/jasminewd2": "~2.0.8",
    "@types/node": "^12.12.27",
    "codelyzer": "^5.2.1",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^4.4.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "^2.1.1",
    "karma-jasmine": "~3.1.1",
    "karma-jasmine-html-reporter": "^1.5.2",
    "typescript": "3.7.5"
  },
  "optionalDependencies": {
    "node-sass": "^4.12.0",
    "protractor": "~5.4.2",
    "ts-node": "~8.4.1",
    "tslint": "~5.20.0"
  }
}
```

Answer 1

TL; DR
可悲的是，该问题似乎与Angular CLI启动应用程序的Angular部分的方式上的某些更改有关。根据此问题:
https://github.com/dotnet/aspnetcore/issues/17277
建议的解决方案是设置进度:在angular.json中为true，或者在ng serve(https://github.com/dotnet/aspnetcore/issues/17277#issuecomment-562433864)之前执行简单的回显。
完整答案
我挖了asp.net核心代码库(https://github.com/dotnet/aspnetcore)，看一下Angular模板如何启动Angular应用程序。
启动角度服务器的核心引擎由两个类表示:AngularCliMiddleware(https://git.io/JvlaL)和NodeScriptRunner(https://git.io/Jvlaq)。
在AngularCliMiddleware中，我们找到以下代码(我删除了原始注释，并添加了一些自己的注释，以解释一些事情):

public static void Attach(ISpaBuilder spaBuilder, string npmScriptName)
{
    var sourcePath = spaBuilder.Options.SourcePath;
    if (string.IsNullOrEmpty(sourcePath))
    {
        throw new ArgumentException("Cannot be null or empty", nameof(sourcePath));
    }

    if (string.IsNullOrEmpty(npmScriptName))
    {
        throw new ArgumentException("Cannot be null or empty", nameof(npmScriptName));
    }

    // Start Angular CLI and attach to middleware pipeline
    var appBuilder = spaBuilder.ApplicationBuilder;
    var logger = LoggerFinder.GetOrCreateLogger(appBuilder, LogCategoryName);
    var angularCliServerInfoTask = StartAngularCliServerAsync(sourcePath, npmScriptName, logger);

    var targetUriTask = angularCliServerInfoTask.ContinueWith(
        task => new UriBuilder("http", "localhost", task.Result.Port).Uri);

    SpaProxyingExtensions.UseProxyToSpaDevelopmentServer(spaBuilder, () =>
    {
        var timeout = spaBuilder.Options.StartupTimeout;
        return targetUriTask.WithTimeout(timeout,
            $"The Angular CLI process did not start listening for requests " +

            // === NOTE THIS LINE, THAT CARRIES THE "0 seconds" BUG!!!
            $"within the timeout period of {timeout.Seconds} seconds. " + 

            $"Check the log output for error information.");
    });
}

private static async Task<AngularCliServerInfo> StartAngularCliServerAsync(
    string sourcePath, string npmScriptName, ILogger logger)
{
    var portNumber = TcpPortFinder.FindAvailablePort();
    logger.LogInformation($"Starting @angular/cli on port {portNumber}...");

    var npmScriptRunner = new NpmScriptRunner(
        sourcePath, npmScriptName, $"--port {portNumber}", null);
    npmScriptRunner.AttachToLogger(logger);

    Match openBrowserLine;
    using (var stdErrReader = new EventedStreamStringReader(npmScriptRunner.StdErr))
    {
        try
        {
            // THIS LINE: awaits for the angular server to output
            // the 'open your browser...' string to stdout stream
            openBrowserLine = await npmScriptRunner.StdOut.WaitForMatch(
                new Regex("open your browser on (http\\S+)", RegexOptions.None, RegexMatchTimeout));
        }
        catch (EndOfStreamException ex)
        {
            throw new InvalidOperationException(
                $"The NPM script '{npmScriptName}' exited without indicating that the " +
                $"Angular CLI was listening for requests. The error output was: " +
                $"{stdErrReader.ReadAsString()}", ex);
        }
    }

    var uri = new Uri(openBrowserLine.Groups[1].Value);
    var serverInfo = new AngularCliServerInfo { Port = uri.Port };

    await WaitForAngularCliServerToAcceptRequests(uri);

    return serverInfo;
}

如您所见， StartAngularCliServerAsync 方法创建一个新的 NpmScriptRunner 对象，该对象是Process.Start方法调用的包装，基本上，它附加了记录器，然后等待进程的StdOut发出与“在httpSOMETHING ...上打开浏览器...”。
有趣的是，这应该可行!
如果在ClientApp文件夹中运行ng serve(或npm run start)，则服务器启动后，仍会发出输出“在http ...上打开浏览器”。
如果您通过dotnet运行该应用程序，则节点服务器实际上会启动，只需在Debug模式下启用所有日志，找到“在端口上启动@ angular/cli ...”行，然后尝试访问该端口上的localhost，您将看到您的角度应用程序正在运行。
问题是，由于某种原因，StdOut不再使“打开浏览器打开”行，也不是由记录器编写的……似乎以某种方式阻止了ng serve的特定输出行，如不再在Stardard输出流中发送。 WaitForMatch方法在5秒后达到超时，并从WithTimeout扩展方法的代码中捕获，该方法输出(错误的)“... 0秒...”消息。
就我所看到的，一旦您的dotnet运行您的应用程序，就会依次产生一系列过程，但是我没有注意到从Angular 8到Angular 9命令行中的任何区别。
我的理论是，Angular CLI中发生了一些更改，导致该行无法在stdout中发送，因此.net代理无法捕获该行，因此无法检测到何时启动了角度服务器。
根据此问题:
https://github.com/dotnet/aspnetcore/issues/17277
建议的解决方案是设置进度:在angular.json中为true或在ng serve( https://github.com/dotnet/aspnetcore/issues/17277#issuecomment-562433864)之前执行简单的回显。