带有 Verizon 的 Azure CDN - 重写 URL 以始终加载 index.html
Azure CDN with Verizon - Rewriting URL to always load index.html
上下文
过去几天我一直在努力解决以下问题，由于 CDN 的性质和每个新规则的人工审查，我每次部署新规则最多需要 4 小时.
如以下主题所述，我目前将我的 Angular 应用程序部署到一个 存储帐户，它有一个 blob 容器 调用了 cdn
在这个 blob 容器 的 root 中，我的 angular 项目中的整个 dist 文件夹有通过我的 CI 设置复制。
CDN 配置文件也已设置，指向名为 /cdn
的 origin-path
问题
不幸的是，目前正在进行 issue 您无法直接访问默认文件。
我想要的是重定向来自我的 Angular 的所有传入流量
应用到 index.html 文件。这是为了满足路由
Angular.
此外，我想允许任何对静态文件（例如图像）的请求
通过没有任何特定的 url 重写。
我看过关于这个问题的各种帖子，但 none 的答案似乎涵盖了我的情况，或者没有提供预期的结果。
目前我正在使用来自 Verizon 的 Azure CDN 的 规则引擎 功能。
关于模式，我使用了 following article 中提到的所有模式，包括评论中提到的模式。
我也花了至少两天时间寻找各种其他文章和 Whosebug 文章，但其中 none 对我的情况有用。
此外，我还创建了自己的正则表达式模式，但尽管它们在我的测试环境中工作，但一旦部署到 CDN，它们就会工作。
我通常会得到以下结果之一：
- 顶级域
https://myFancyWebsite.azureedge.net 不会将 url 重写为 index.html，我会收到一个 http 错误 404
- 顶级域将重定向到
index.html，但一旦我添加 url 路径 https://myFancyWebsite.azureedge.net/login/callback 就会停止工作 - 一旦我再次出现 http 错误 404开始使用 /login/callback
- 顶级域会在 http 错误
431 中将 url 重写为类似 https://myFancyWebsite.azureedge.net/cdn/cdn/cdn/cdn/cdn/cdn/cdn/cdn/cdn/cdn .... 的内容
Microsoft 的官方 documentation 对我的情况也没有帮助。
我很确定我不是第一个将 Angular 应用程序部署到存储帐户的人，有人 运行 遇到了与我相同的问题。
我很感谢能给我指明正确方向的任何信息，因为目前我确实在考虑放弃整个存储帐户部署。
更新 1
使用下面 source 模式 ((?:[^\?]*/)?)($|\?.*) 也被提到 article 在这里，我至少能够处理顶级域重写到 index.html 文件.
不幸的是，我仍然需要一个额外的模式来从 https://myFancyWebsite.azureedge.net/login/callback 重定向到 https://myFancyWebsite.azureedge.net/index.html
更新 2
我目前每天更新一次或两次正则表达式模式，它再次在我的测试环境中工作，但一旦我部署它就停止工作。我开始相信 Azure CDN 会在顶级域之后向 URL 附加一些内容，但我不知道如何验证这一点。
https://regex101.com/r/KK0jCN/23
更新 3
我们写的是 3025 年，我仍然不知道为什么例如以下模式不处理顶级域的 url 重写。
根据您的要求，我自己测试了这个问题。根据我的测试，您可以尝试利用以下 URL 重写规则：
来源模式：(http[s]?://[^\?/#]+)(/(?!images)(?!scripts)[^\?#]*)?($|[\?#].*)
目标模式：/index.html
注意：为了正确加载其他文件（.ico、.txt、.js、.css等），您需要将它们移动到新的虚拟机中目录而不是 blob 容器的根目录。例如，您可以将图像文件移动到 cdn\images 并将 JavaScript 文件移动到 cdn\scripts，然后正则表达式将忽略相关的虚拟文件夹。
此外，您可以使用 Azure Web App 托管您的静态网站并选择免费定价层或共享层，每个实例每月花费 9.49 美元。您可以关注的详细信息 Pricing calculator.
更新：
根据Justin的回答，我检查了这个问题，发现对于Blob存储源类型，URL Rewrite下的Source和Destination是针对blob的请求存储端点。因此，我们需要针对 blob 端点的请求路径和查询字符串设置正则表达式。
Justin Gould 提供了将所有内容重写为 cdn/index.html 的答案。根据您的情况，我已经测试了我的规则，它可以在我这边工作。
测试：
- 添加条件为 If Always
的新规则
- 您需要为每个端点添加一个新功能。
- 对于模式，输入
[^?.]*(\?.*)?$。此模式捕获其中包含 . 的 URL 路径，但不关心它是否在查询字符串中。
- 对于路径，输入
origin_path/document.ext。这是棘手的部分。路径是相对于原始根的。例如，如果您的 CDN 终结点的原始路径是 /origin_path，并且您想要重定向到 index.html，您将输入 origin_path/index.html。如果您的 CDN 由 Azure 存储帐户支持并且源点指向容器，则情况总是如此。
- 点击“添加”添加您的规则，等待 N 小时，您就可以开始了。
补充一下。如果你使用的是 Azure Verizon Premium CDN，并且你的 Azure 端点使用的是原始路径。原始路径是重写的一部分。例如，假设您要指向 $web blob 中的版本化文件夹。
因此，如果上图中的“源路径”是 2.1.2，而您当前的静态应用程序在 $web/2.1.2/，那么您对 CDN 的重写将是 Source: /<your-verizon-origin>/<your-azure-endpoint>/(.*)\/[^?.]*(\?.*)?$ - -> 目的地：/<your-verizon-origin>/<your-azure-endpoint>//index.html
上下文
过去几天我一直在努力解决以下问题，由于 CDN 的性质和每个新规则的人工审查，我每次部署新规则最多需要 4 小时.
如以下主题所述，我目前将我的 Angular 应用程序部署到一个 存储帐户，它有一个 blob 容器 调用了 cdn
在这个 blob 容器 的 root 中，我的 angular 项目中的整个 dist 文件夹有通过我的 CI 设置复制。
CDN 配置文件也已设置，指向名为 /cdn
origin-path
问题
不幸的是，目前正在进行 issue 您无法直接访问默认文件。
我想要的是重定向来自我的 Angular 的所有传入流量 应用到
index.html文件。这是为了满足路由 Angular.此外，我想允许任何对静态文件（例如图像）的请求 通过没有任何特定的 url 重写。
我看过关于这个问题的各种帖子，但 none 的答案似乎涵盖了我的情况，或者没有提供预期的结果。
目前我正在使用来自 Verizon 的 Azure CDN 的 规则引擎 功能。
关于模式，我使用了 following article 中提到的所有模式，包括评论中提到的模式。
我也花了至少两天时间寻找各种其他文章和 Whosebug 文章，但其中 none 对我的情况有用。
此外，我还创建了自己的正则表达式模式，但尽管它们在我的测试环境中工作，但一旦部署到 CDN，它们就会工作。
我通常会得到以下结果之一：
- 顶级域
https://myFancyWebsite.azureedge.net不会将 url 重写为index.html，我会收到一个 http 错误404 - 顶级域将重定向到
index.html，但一旦我添加 url 路径https://myFancyWebsite.azureedge.net/login/callback就会停止工作 - 一旦我再次出现 http 错误404开始使用/login/callback - 顶级域会在 http 错误
431 中将 url 重写为类似
https://myFancyWebsite.azureedge.net/cdn/cdn/cdn/cdn/cdn/cdn/cdn/cdn/cdn/cdn .... 的内容
Microsoft 的官方 documentation 对我的情况也没有帮助。
我很确定我不是第一个将 Angular 应用程序部署到存储帐户的人，有人 运行 遇到了与我相同的问题。
我很感谢能给我指明正确方向的任何信息，因为目前我确实在考虑放弃整个存储帐户部署。
更新 1
使用下面 source 模式 ((?:[^\?]*/)?)($|\?.*) 也被提到 article 在这里，我至少能够处理顶级域重写到 index.html 文件.
不幸的是，我仍然需要一个额外的模式来从 https://myFancyWebsite.azureedge.net/login/callback 重定向到 https://myFancyWebsite.azureedge.net/index.html
更新 2
我目前每天更新一次或两次正则表达式模式，它再次在我的测试环境中工作，但一旦我部署它就停止工作。我开始相信 Azure CDN 会在顶级域之后向 URL 附加一些内容，但我不知道如何验证这一点。
https://regex101.com/r/KK0jCN/23
更新 3
我们写的是 3025 年，我仍然不知道为什么例如以下模式不处理顶级域的 url 重写。
根据您的要求，我自己测试了这个问题。根据我的测试，您可以尝试利用以下 URL 重写规则：
来源模式：(http[s]?://[^\?/#]+)(/(?!images)(?!scripts)[^\?#]*)?($|[\?#].*)
目标模式：/index.html
注意：为了正确加载其他文件（.ico、.txt、.js、.css等），您需要将它们移动到新的虚拟机中目录而不是 blob 容器的根目录。例如，您可以将图像文件移动到 cdn\images 并将 JavaScript 文件移动到 cdn\scripts，然后正则表达式将忽略相关的虚拟文件夹。
此外，您可以使用 Azure Web App 托管您的静态网站并选择免费定价层或共享层，每个实例每月花费 9.49 美元。您可以关注的详细信息 Pricing calculator.
更新：
根据Justin的回答，我检查了这个问题，发现对于Blob存储源类型，URL Rewrite下的Source和Destination是针对blob的请求存储端点。因此，我们需要针对 blob 端点的请求路径和查询字符串设置正则表达式。
Justin Gould 提供了将所有内容重写为 cdn/index.html 的答案。根据您的情况，我已经测试了我的规则，它可以在我这边工作。
测试：
- 添加条件为 If Always 的新规则
- 您需要为每个端点添加一个新功能。
- 对于模式，输入
[^?.]*(\?.*)?$。此模式捕获其中包含.的 URL 路径，但不关心它是否在查询字符串中。 - 对于路径，输入
origin_path/document.ext。这是棘手的部分。路径是相对于原始根的。例如，如果您的 CDN 终结点的原始路径是/origin_path，并且您想要重定向到index.html，您将输入origin_path/index.html。如果您的 CDN 由 Azure 存储帐户支持并且源点指向容器，则情况总是如此。 - 点击“添加”添加您的规则，等待 N 小时，您就可以开始了。
补充一下。如果你使用的是 Azure Verizon Premium CDN，并且你的 Azure 端点使用的是原始路径。原始路径是重写的一部分。例如，假设您要指向 $web blob 中的版本化文件夹。
因此，如果上图中的“源路径”是 2.1.2，而您当前的静态应用程序在 $web/2.1.2/，那么您对 CDN 的重写将是 Source: /<your-verizon-origin>/<your-azure-endpoint>/(.*)\/[^?.]*(\?.*)?$ - -> 目的地：/<your-verizon-origin>/<your-azure-endpoint>//index.html