TimeoutException:Angular CLI进程未在0秒的超时时间内开始侦听请求

Khizar Murad:

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

页面响应的完整列表为:

TimeoutException:Angular CLI进程未在0秒的超时时间内开始侦听请求。检查日志输出以获取错误信息。Microsoft.AspNetCore.SpaServices.Extensions.Util.TaskTimeoutExtensions.WithTimeout(任务任务,TimeSpan timeoutDelay,字符串消息) proxy404s)Microsoft.AspNetCore.Builder.SpaProxyingExtensions + <> c__DisplayClass2_0 + <b__0> d.MoveNext()Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.Invoke(HttpContext上下文)

我的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"
  }
}
```
克劳迪奥·瓦莱里奥:

TL; DR

可悲的是,该问题似乎与Angular CLI启动应用程序的Angular部分的方式上的某些更改有关。根据此问题:

https://github.com/dotnet/aspnetcore/issues/17277

建议的解决方案是设置进度:在angular.json中为true或在ng服务之前执行简单的回显(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服务之前执行简单的回显(https://github.com/dotnet/aspnetcore/issues/17277#issuecomment-562433864)。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

在给定的超时时间内等待条件

测试超时应该取消 EventChannel 并抛出 TimeoutException

Angular 2+ HTTP请求-在最小持续时间内显示加载微调器,以获取成功和错误响应

Spring Integration Java DSL HTTP超时时间内未收到回复

无法在超时时间内连接到Zookeeper服务器:10000

Azure BlobWriteStream客户端无法在指定的超时时间内完成操作

在固定的超时时间内缓存单个对象的最佳方法是什么?

如何确定哪个Jest测试在超时时间内无法运行?

NPM脚本“开始”退出,但未指示Angular CLI正在侦听请求

如何使用Angular设置HttpHandler的超时时间?

after_step中的HOOK-ERROR:TimeoutException:消息:超时

接收TimeoutException的可能原因是什么:使用Spark时,期货在[n秒]之后超时

为什么联接失败并显示“ java.util.concurrent.TimeoutException:期货在[300秒]后超时”?

selenium.common.exceptions.TimeoutException:消息:脚本超时:30秒内未收到结果

如何在几秒钟内重试某些方法,并且在超时时抛出方法的异常而不是硒中的TimeoutException?

量角器/ Jasmine2-在指定的超时时间内未调用异步回调

如果程序在给定的超时时间内未产生任何输出,该如何终止该程序?

Karma Jasmine-在jasmine.DEFAULT_TIMEOUT_INTERVAL指定的超时时间内未调用异步回调

Raspberry Gammu在指定的超时时间内没有响应。手机可能未连接

“未能在超时时间内找到libpython。” 尝试在不带有pyflame的容器中分析.py文件时

请求超时。Web服务器在指定时间内响应失败

Angular 在短时间内加载项目两次

Paket TimeoutException

TimeoutException的起源

TimeoutException的起源

TimeoutException硒

设置超时时间为零秒

KStreams-org.apache.kafka.common.errors.TimeoutException:60000毫秒的超时已成功提交偏移量

Flink:执行管道java.util.concurrent.TimeoutException时出错:期货在[10000毫秒]后超时