Manifest.json加载index.html

Question

Manifest.json在谷歌Chrome上加载index.html

我正在构建的React应用程序有一个manifest.json，它是我第一次使用Create-React- App时创建的，如下所示：

{
  "short_name": "React App",
  "name": "Create React App Sample",
  "icons": [
    {
      "src": "favicon.ico",
      "sizes": "64x64 32x32 24x24 16x16",
      "type": "image/x-icon"
    }
  ],
  "start_url": ".",
  "display": "standalone",
  "theme_color": "#000000",
  "background_color": "#ffffff"
}

但是，当我使用AWS-Amplify将网站发布到S3存储桶时，manifest.json加载的是我的index.html。我的manifest.json的第一个index.html响应具有正确的报头，如下所示：

<link rel="manifest" href="/manifest.json">

链接到我的清单似乎是正确的，我的网站要求它，但有另一个index.html作为回应。与index.html位于同一目录中的manifest.json文件。

在我的本地主机中，manifest.json加载得很好。当我尝试构建它并从build文件夹中提供它时，manifest.json也可以很好地加载。这个问题只发生在我们部署的网站上。我已经检查了S3中的部署文件，它看起来与我们构建的文件完全相同，所以我不知道哪里出了问题。

我怀疑这可能是Chrome的问题，因为火狐和边缘浏览器不需要Manifest.json。然而，这并不能解释为什么我的本地主机和本地构建能够在Chrome中成功加载manifest.json。

我希望manifest.json是一个真正的json文件，而不是index.html。

Answer 1

在Amplify中部署的React应用程序解决了此问题：

Aws-Amplify: manifest.json and env.json loading index.html

主要问题是SPA需要到index.html的服务器端重定向，并且清单应该是这些重定向的例外，