在基于 Angular Cli 的应用程序中将数据从 ASP.NET Core 传递到 Typescript

Isa*_*vin 5 c# server-side-rendering angular asp-net-core-spa-services spa-template

我正在尝试设置一个 SPA,我可以在其中将数据从 appsettings.json 传递到服务器渲染的客户端。我按照步骤使用新的 SpaServices 模板配置 SSR

https://docs.microsoft.com/en-us/aspnet/core/spa/angular

但是我不明白如何完成这里标记的任务

您可以通过 Angular 支持的任何方式将其传递给应用程序的其他部分

我看到使用的示例是 base_url,但似乎 base 作为 DOM 元素注入页面

 <base href='/'>
Run Code Online (Sandbox Code Playgroud)

但不清楚如何以这种方式阅读其他项目。我正在测试通过应用程序是否为 Https,我的 Startup.cs 中有此部分

options.SupplyData = (context, data) =>
{
    data["isHttpsRequest"] = context.Request.IsHttps;
};
Run Code Online (Sandbox Code Playgroud)

并在 main.server.ts

 { provide: 'isHttps', useValue: params.data.isHttpsRequest }
Run Code Online (Sandbox Code Playgroud)

但在 main.ts 中我迷路了,我有这样的东西

export function getBaseUrl() {
  return document.getElementsByTagName('base')[0].href;
}

export function getIsHttps() {
  // NO idea what needs to go here
  return "";
}

const providers = [
  { provide: 'BASE_URL', useFactory: getBaseUrl, deps: [] },
  { provide: 'isHttps', useFactory: getIsHttps, deps: [] }
];
Run Code Online (Sandbox Code Playgroud)

我不确定 SpaServices 如何将 Prerender 上的值注入应用程序(我查看了代码,但我不清楚)。价值是否放在窗口上?如何读取值以便可以注入组件的构造函数?

Ben*_*rds 0

因此,我深入研究并尝试使其发挥作用,但不幸的是,它并不像您那样工作,或者我认为它应该有效。“您可以通过 Angular 支持的任何方式将其传递给应用程序的其他部分”意味着客户端代码需要可以通过使用全局命名空间或其他方式(我无法想到)来访问它。当应用程序通过 main.server.ts 呈现时,您可以嵌入来自服务器的变量,但这并不意味着它们可以自动供客户端应用程序使用......在我看来,这是一个半成品的解决方案,而您我并不是唯一对此感到困惑的人(请参阅https://github.com/aspnet/JavaScriptServices/issues/1444)。

我建议您寻找包含服务器端数据的其他方法,例如应用程序引导程序上的配置服务,该服务在启动时获取配置,或者在由服务器端代码编写的 Angular 托管页面中嵌入 JSON 对象。