如何在 AWS S3/CDN 中托管具有环境特定值的 Blazor Webassembly

Posted 2023-03-04

【中文标题】如何在 AWS S3/CDN 中托管具有环境特定值的 Blazor Webassembly

【英文标题】：How to host Blazor Webassembly with Environment specific value in AWS S3/CDN

【发布时间】：2021-02-09 02:49:57

【问题描述】：

我搜索了所有官方文档，但找不到任何关于如何在 S3/CDN 中托管 Blazor Webassembly 并具有特定环境值的信息。

您可以想象该应用将具有 3 个不同的环境开发、测试、生产。每个环境都有自己的环境特定值。例如api url、client id、api key。

如果我在 IIS 中托管 Blazor Webassembly 应用程序，我可以将特定于环境的值放在 appSetting.environment.json 中，然后我可以在 web.config 中设置“ASPNETCORE_ENVIRONMENT”的值来指定应用程序的环境.

但是我们如何在 S3 和 CDN 中做到这一点呢？

【问题讨论】：

这可能会解决您的问题：***.com/a/47648283/14033548

@BrianParker thx，如果您托管 blazor 服务器应用程序，它会正常工作。但是现在，问题出在 blazor 客户端应用程序中，发布后它没有任何后端服务器端代码，它不会加载任何后端配置，它就像一个静态页面

wasm 客户端可以在 wwwroot 文件夹中拥有自己的 appsettings.json。

@BrianParker 但是 wasm 客户端应用程序如何在 S3 中读取特定于环境的 appsettings.environment.json？您无法将环境设置为 IIS。

【参考方案1】：

如果有一种方法可以在请求中指定自定义标头，您可以通过发送带有您期望的环境名称的“blazor-environment”标头来告诉 blazor wasm 它在哪个环境中运行。本文解释了 blazor-environment 的使用：

https://docs.microsoft.com/en-gb/aspnet/core/blazor/fundamentals/environments?view=aspnetcore-3.1

不确定如何在 S3 中设置自定义标头...也许您需要结合使用 Cloud Front 和 S3 来实现这一点，抱歉我无法完全回答这个问题。

【参考方案2】：

我们遇到了同样的问题，我们使用 CloudFront 和他们的“新”CloudFront Functions 解决了这个问题。来自 S3 的 CloudFront 分配源。

这基于使用此处记录的响应标头方法：https://docs.microsoft.com/en-us/aspnet/core/blazor/fundamentals/environments?view=aspnetcore-5.0#set-the-environment-via-header

我创建了以下函数，然后使用 Viewer Response 事件将其应用于 CloudFront 分配：

function handler(event) 
  var response = event.response;
  var headers = response.headers;

  headers['blazor-environment'] =  value: 'Staging' ;

  return response;

在我们的例子中，我们为每个环境使用不同的 AWS 账户，因此我们只需在每个环境中以相同的名称创建相同的函数，然后将“QA”更改为我们想要的任何环境。您还可以轻松地为各种环境创建多个函数，并将适当的函数应用于每个 CloudFront 分配。