如何捆绑.Net Core API + Angular前端 - c#

我有一个面向公众的有角前端,它碰到了.NetCore后端。使用webpack将两个项目捆绑在一起。问题是,我需要启用服务器端渲染,并且Microsoft已弃用/ made UseSpaPrerendering。我确实遵循了这个tutorial,但是它在.net core 3.0 / 3.1中根本无法很好地工作。当我开始工作时,我得到一个FOUC(未渲染内容的闪存),并且页面加载速度非常慢。

在上述情况下,如何部署具有服务器端渲染的.net核心API / Angular前端应用程序?

参考方案

您是否已经尝试将应用程序部署到IIS?
或者,您也可以将ASPNETCORE_ENVIRONMENT(项目属性->调试-> ASPNETCORE_ENVIRONMENT =生产)更改为生产,然后运行应用程序。

现在,在运行应用程序时不构建角度束。为此,您必须从ClientApp文件夹运行以下命令(检查csproj文件,它们就在其中):

npm run build --prod
npm run build:ssr --prod

现在,将生成角度构建文件。如果您在dist / server文件夹旁边看到dist / browser文件夹,则该应用程序不会在生产模式下呈现。浏览器文件夹的内容应该在服务器文件夹旁边(这是一个已知的错误,但是Microsoft不会再对此进行更改)。如果不是这种情况,则始终可以通过更改angular.json文件来解决此问题:projects:ClientApp:architect:build:options:outputPath = dist,而不是dist / browser。这样,应用程序在开发模式下与生产模式下的行为相同。无论环境设置如何,“浏览器”文件将始终以dist文件夹结尾,而ASP.NET Core始终以dist文件夹查找。

在构建了角度服务器/浏览器文件之后,您应该能够按常规在生产模式下运行该应用程序。

你可以试试看吗?我也会尝试。

更新:

我尝试使用.NET Core 3.1从https://medium.com/@pieterjandeclippel/server-side-rendering-in-asp-net-core-angular-6df7adacbdaa进行指南,但它似乎仍然可以正常工作。

您可以尝试执行以下步骤吗?:

打开angular.json文件,找到projects:ClientApp:architect:build:options:outputPath设置,并确保将其设置为dist而不是dist / browser。将此设置为dist将使应用在开发和生产模式下的行为相同。
(可选)删除ClientApp内的dist文件夹。
从ClientApp文件夹运行以下命令:npm run build --prodnpm run build:ssr --prod
打开项目属性页→调试选项卡→将ASPNETCORE_ENVIRONMENT更改为生产
F5运行应用程序

你得到什么结果?如果类似这样的操作不正常,您也可以从“输出”窗口中读取很多信息...

如果此方法有效,则似乎您需要更加耐心,然后等待服务器构建文件出现。因此在开发过程中:

您可以将ASPNETCORE_ENVIRONMENT变量设置为Development。
您可以删除ClientApp / dist文件夹
运行项目时,将运行Startup.cs中指定的浏览器+服务器构建命令
请耐心等待dist / server文件夹出现
刷新浏览器窗口

调用SignalR Hub不适用于Asp.Net Core Web API - c#

我是SignalR的新手。我正在尝试设置一个Asp.Net Core WebAPI,以便其他客户端可以使用SignalR连接到它并获取实时数据。我的Hub类是:public class TimeHub : Hub { public async Task UpdateTime(string message) { await Clients.All.SendAs…

如何在ASP.NET Core Web应用程序中增加JSON反序列化MaxDepth限制 - c#

我们正在将ASP.NET Core 2.1与.NET Framework 4.6.2结合使用。我们有一个客户需要向我们的Web应用程序发送一个很大程度上嵌套的json结构。当他们进行此调用时,我们将输出以下日志并返回错误: 读取器的MaxDepth超过了32。路径“ super.long.path.to property”,第1行,位置42111。”我浏览了…

在Java中,执行“ ++++++++”表达式,编译器未报告任何错误并且可以正确执行? - java

我用eclipse编写了这段代码,用war写过,结果为3d。public static void main(String[] args) { double a = 5d + + + + + +-+3d; System.out.println(a); } 参考方案 您的表情可以改写为(5d) + (+ + + + +-+3d) 其中第一个+是应用于两个操作数的…

如何在ASP.NET Core(使用JavascriptService)应用程序中使Node.js代码调用csharp代码? - c#

我正在将asp.net内核用于简单的Web api服务器(实际上是使用Deepstream)。虽然C#可以使用NodeServices.InvokeExportAsync完美地调用nodejs代码,但是当我尝试将Action / Func作为NodeServices.InvokeExportAsync的参数传递给nodejs时,却得到了System.Aggr…

从.NET Core 2.1降级到.NET 4.7.1时,如何使用IApplicationBuilder和IServiceCollection? - c#

我不得不将我的项目从.NET Core 2.1更改为.NET 4.7.1,并且修复了几乎所有错误,但以下错误仍然困扰着我 “ IApplicationBuilder”不包含“ UseHsts”的定义,也找不到找不到接受类型为“ IApplicationBuilder”的第一个参数的扩展方法“ UseHsts”(是否缺少using指令或程序集引用?) “ IA…