清单 JSON 文件返回 404 not found 错误以及语法错误答案

【问题标题】：Manifest JSON file returning 404 not found error along with a syntax error清单 JSON 文件返回 404 not found 错误以及语法错误
【发布时间】：2020-12-07 14:47:41
【问题描述】：

我已阅读有关此问题的其他帖子，并尝试使用提供的答案，但没有一个有效。我希望有人可以帮助我解决这个问题。我正在使用 React 和 AWS Lambdas 构建一个应用程序。我没有用于放置清单文件的公用文件夹。我已将文件放在存储我的 html 文件以及项目的根目录的模板文件夹中，但我仍然收到无法找到它的错误。我也不确定它为什么抱怨我的语法。我通过 JSONLint 运行它只是为了确保它确实有效并且没有返回错误。下面是我的 manifest.json 文件：

    {
    "short_name": "bat",
    "name": "bat",
    "description": "bat",
    "icons": [{
            "src": "/images/image.png",
            "type": "image/png",
            "sizes": "192x192"
        },
        {
            "src": "/images/image.png",
            "type": "image/png",
            "sizes": "512x512"
        }
    ],
    "start_url": "/?source=pwa",
    "background_color": "#3367D6",
    "display": "standalone",
    "scope": "/",
    "theme_color": "#3367D6",
    "shortcuts": [{
            "name": "bat",
            "short_name": "bat",
            "description": "bat",
            "url": "./?source=pwa",
            "icons": [{
                "src": "/images/image.png",
                "sizes": "192x192"
            }]
        },
        {
            "name": "bat",
            "short_name": "bat",
            "description": "bat espanol",
            "url": "./es?source=pwa",
            "icons": [{
                "src": "/images/image.png",
                "sizes": "192x192"
            }]
        }
    ]
}

如果您还有其他需要，请告诉我。

更新看到有 manifest.json 文件，我的项目仍然存在问题。 React 应用程序不是使用 create-react-app 构建的。它是从头开始建造的。我被请来帮助维护和添加新功能。这些新功能之一是将网站转换为 PWA 的 manifest.json 文件。因此，我在两个 html 文件中都添加了 <link rel="manifest" href="/manifest.json" />，因为整个项目中只有两个 html 文件。我还根据article 在根目录中创建了 manifest.json 文件，但仍然无法正确读取 manifest.json 文件，因为我仍然收到 404（未找到）错误以及第 1 行，列1 语法错误。

【问题讨论】：

标签： reactjs typescript amazon-web-services aws-lambda

【解决方案1】：

仅在 /public 中添加清单文件是不够的。

您还必须在 index.html 头标签中添加清单。

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

试试这个。

【讨论】：

还要确保清单中的图标路径正确。
我也试过了。我没有 index.html 文件。该项目的设置方式只有两个 html 文件，我已将 ` 添加到两个文件中，但仍然收到 404 错误。
原来这就是答案。我需要为项目做更多的配置，但这最终成为了答案。谢谢。

【解决方案2】：

在href 清单中添加整个路径：

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

我也没有公用文件夹，但我在另一个文件夹中使用 manifest .json 来存放 PWA 的东西，并且以这种方式使用它是可行的。

【讨论】：