Manifest.json 加载 index.html答案

【问题标题】：Manifest.json loads index.htmlManifest.json 加载 index.html
【发布时间】：2019-09-27 10:54:13
【问题描述】：

Manifest.json 在 Google Chrome 上加载 index.html

我正在构建的 React App 有一个 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。第一个 index.html 响应具有我的 manifest.json 的正确标题，如下所示：

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

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

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

我怀疑这可能是 Chrome 问题，因为在 Firefox 和 Edge 中未请求 Manifest.json。但是，这并不能解释为什么我的 localhost 和本地构建能够在 Chrome 中成功加载 manifest.json。

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

【问题讨论】：

您确定 manifest.json 存在于您的公用文件夹中吗？听起来它找不到文件并重定向到 index.html。
@Webber，在构建之前，manifest.json 在我的公共文件夹中。构建后，它与 index.html 位于同一文件夹中，并且存在于我的本地构建和部署的构建中
我也有这个问题 - 你解决了吗？
@Raph117，不，项目最终被放弃了哈哈哈。我怀疑某些路由处理不当（当时我们使用的是 Route53）。祝你好运！
@LumoWoong 哈哈很遗憾听到这个消息。谢天谢地，我们把它整理好了。问题出在 apache 服务器上，因此任何阅读本文的前端开发人员都可能想与服务器人员聊天

标签： reactjs create-react-app aws-amplify manifest.json

【解决方案1】：

对于部署在 Amplify 中的 React 应用，此问题已在此处解决：

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

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

【讨论】：