如何为ASP.NET Core Angular应用程序设置默认端口

时间:2018-05-31 22:51:20

标签: angular asp.net-core

我使用dotnet CLI使用模板带有Angular的ASP.NET Core 创建了一个dotnet核心项目

dotnet new angular

现在,每当我使用dotnet run命令运行应用程序时,angular每次都会使用不同的端口。

我尝试在angular-cli.json

中设置默认服务端口
"defaults": {
  ..
  "serve": {
    "port": 4200
  }
}

虽然不起作用。

我无法在线找到任何文档,那么我在哪里可以设置默认端口?

4 个答案:

答案 0 :(得分:8)

SpaServices正在从package.json文件中获取“ ng serve”命令,并在运行该命令之前添加一个随机端口。在Windows中,要解决此问题,请添加您自己的port命令和后缀“&REM”,该后缀告诉命令处理器此后的所有内容均为注释。

"scripts": {
  "ng": "ng",
  "start": "ng serve --hmr --o --port=5002 &REM",
  ...
  }

在命令窗口中,处理后会看到类似以下内容的东西:

  > ng serve --hmr --o --port=5002 &REM "--port" "58198"

答案 1 :(得分:2)

好的,事实证明,更改端口并不重要,因为我可以从网址http://localhost:5000

访问Angular应用程序
$ dotnet run
Using launch settings from /Users/raviteja/Desktop/CSharp/SignalR-Angular-ChatApp/Properties/launchSettings.json...
: Microsoft.AspNetCore.DataProtection.KeyManagement.XmlKeyManager[0]
      User profile is available. Using '/Users/raviteja/.aspnet/DataProtection-Keys' as key repository; keys will not be encrypted at rest.
info: Microsoft.AspNetCore.SpaServices[0]
      Starting @angular/cli on port 56082...
Hosting environment: Development
Content root path: /Users/raviteja/Desktop/CSharp/SignalR-Angular-ChatApp
Now listening on: https://localhost:5001
Now listening on: http://localhost:5000
Application started. Press Ctrl+C to shut down.
info: Microsoft.AspNetCore.SpaServices[0]
      > SignalR_Angular_ChatApp@0.0.0 start /Users/raviteja/Desktop/CSharp/SignalR-Angular-ChatApp/ClientApp
      > ng serve --extract-css "--port" "56082"

      ** NG Live Development Server is listening on localhost:56082, open your browser on http://localhost:56082/ **

info: Microsoft.AspNetCore.SpaServices[0]
      Date: 2018-05-31T23:44:11.061Z

info: Microsoft.AspNetCore.SpaServices[0]
      Hash: 7f8c3d48fb430eed2337
      Time: 13815ms
      chunk {inline} inline.bundle.js (inline) 3.85 kB [entry] [rendered]
      chunk {main} main.bundle.js (main) 50.5 kB [initial] [rendered]
      chunk {polyfills} polyfills.bundle.js (polyfills) 549 kB [initial] [rendered]
      chunk {styles} styles.bundle.css (styles) 119 kB [initial] [rendered]
      chunk {vendor} vendor.bundle.js (vendor) 9.5 MB [initial] [rendered]


info: Microsoft.AspNetCore.SpaServices[0]
      webpack: Compiled successfully.

我认为此行中指定的端口是我应该用来访问Angular应用程序的端口

Starting @angular/cli on port 56082...
事实证明,它不是我应该使用的那个

来自MSDN

  

该应用程序启动了Angular CLI服务器的实例   背景。将记录类似于以下内容的消息:NG Live   开发服务器正在侦听localhost :,打开你的   浏览器http://localhost:/。 忽略此消息 -it'   组合的ASP.NET Core和Angular CLI应用程序的URL。

但是当我试图访问http://localhost:5000时,我收到了SSL错误,经过更多的挖掘,我在Startup.cs中找到了这一行

app.UseHttpsRedirection();

添加此条件后,它现在正常工作,我可以在http://localhost:5000

访问Angular应用程序
if (!env.IsDevelopment())
    app.UseHttpsRedirection();

答案 2 :(得分:1)

一般来说,你是对的,但是我已经看到了其他几个可能被覆盖的地方。一个将在package.json中,特别是在这个块中:

  "scripts": {
    "ng": "ng",
    "start": "ng serve --sourcemap --extractCss --host 0.0.0.0 --proxy-config proxy.config.json",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  }

如果你有的话,你也可以签入一个名为proxy.config.json的文件

答案 3 :(得分:1)

尝试以下命令:

ng set defaults.serve.port=4201