托管在通过 Azure Front Door 访问的存储帐户上的静态网站未正确加载

Posted 2023-02-19

【中文标题】托管在通过 Azure Front Door 访问的存储帐户上的静态网站未正确加载

【英文标题】：Static websites hosted on storage accounts accessed through Azure Front Door not loaded properly

【发布时间】：2021-08-06 16:46:54

【问题描述】：

我们正在尝试将 Azure Front Door 配置为在托管在两个不同存储帐户上的两个相同静态网站之间路由流量。已在 Front Door 中设置了一个后端池，其中包含 2 个后端主机名（指向存储帐户的链接）。仅启用一个后端主机后，通过 Front Door URL 访问网站就可以正常工作。但是，我们需要同时启用它们才能启用负载平衡以及蓝/绿部署。

网站的加载方式是初始请求获取 index.html 文件。 index.html 文件引用了大约。 20 个 .js 文件。然后它尝试通过前门的 20 个新请求来检索所有这些 .js 文件。如前所述，这在仅启用一个受支持的主机的情况下工作得非常好。但是，当它们都启用时，一些加载 .js 文件的请求被路由到存储帐户 1，而一些被路由到存储帐户 2，这导致其中一些返回 404，未找到。 Web 应用程序是基于反应的，因此构建时生成的脚本对文件名进行了哈希处理，这意味着两个存储帐户上的文件名不同，从而解释了 404。

我怎么看，这个问题有两种解决方案：

我们可以强制 react 以相同的名称命名构建文件吗？如果是这样，那么所有请求都通过前门路由并不重要。 我们能否配置前门以确保加载脚本的所有请求都路由到与加载 index.html 的初始请求相同的后端主机？我们已尝试启用 Session Affinity，但未按预期工作。

非常感谢！

【参考方案1】：

您可以在前门启用会话亲和性，以确保来自一个客户端的请求始终在同一个后端结束，这是在 AFD 中的前端/域上配置的