无法获得通往 /manifest.webmanifest 的路线来工作

Question

我环顾四周，似乎找不到任何真正解决此问题的方法（在此先感谢您的帮助）。

我已经用 Ionic 建立了一个网站。直播于https://www.fairydustgame.com/

我正在尝试使其成为 PWA。当我加载网站时，我可以看到它抛出以下错误；

Manifest: Line: 1, column: 1, Syntax error.

我的清单文件位于 /manifest.webmanifest - 在我的应用程序的 index.html 文件中引用。

如果我在本地运行该站点，则不会出现该错误。相关 - 如果我通过 localhost 访问 /manifest.webmanifest 我可以加载页面。但是 - 如果我尝试在线访问同一页面，我会收到路由错误。

ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'manifest.webmanifest'

这是我的 app-routing-module.ts

  {
    path: '',
    loadChildren: () => import('./home/home.module').then( m => m.HomePageModule)

  }
];

我知道我在根目录加载 /home 模块，所以我也尝试将清单文件复制到 /home 目录中。没有骰子。

我目前使用 AWS Amplify 进行托管，但使用 Cloudflare 进行缓存 - 使用直接 Amplify URL 访问该站点具有相同的行为。

我已尝试根据this answer 包含跨域并添加必要的重定向

我还尝试复制 manifest.webmanifest 以创建 manifest.json 文件 - 如果我这样做 that 并尝试在本地访问 manifest.json - 我会遇到相同的路由错误。我尝试在 /www 文件夹中手动重复复制，并尝试this auto-copy solution 尝试让 manifest.json 在本地工作，但如果我将 index.html 引用更改为读取 manifest.json 我会得到相同的路由错误和@ 987654327@ 托管 manifest.webmanifest。

我也尝试将 manifest.json 复制到 /home 目录以防万一。再次 - 没有骰子。

在这一点上，我不知道下一步该去哪里 - 我不确定我是否只是从根本上误解了路由的工作原理。尽管即使在那种情况下——对我来说，一条路由可以在本地工作但在放大时却不能工作，这对我来说很奇怪。除非，也许，amplify 无法处理 webmanifest 文件扩展名，但我似乎无法让我的本地实例理解 .json 重命名，所以我不知道如何测试它。

任何帮助将不胜感激。

Answer 1

事实证明，我必须在 AWS Amplify 中重新排序重定向 - 将重定向放在首位，然后开始提取清单文件。