Chrome 开发者工具无法检测清单答案

【问题标题】：Chrome developer tools can't detect manifestChrome 开发者工具无法检测清单
【发布时间】：2018-06-30 16:34:54
【问题描述】：

我有 manifest.json，并使用 <link rel="manifest" href="./manifest.json"> 添加到我的 HTML。

我认为一切都很好，但我不明白为什么 chrome 开发工具无法检测到我的清单！

我的 manifest.json：

{
    "name": "Arman News",
    "short_name": "Ar News",
    "description": "This is my first try to make PWA webstie.",
    "theme_color": "#ffffff",
    "background_color": "#ffffff",
    "display": "standalone",
    "Scope": "/",
    "start_url": ".",
    "icons": [
      {
        "src": "img/icons/Icon-192.png",
        "sizes": "192x192",
        "type": "image/png"
      },
      {
        "src": "img/icons/Icon-512.png",
        "sizes": "512x512",
        "type": "image/png"
      }
    ],
    "splash_pages": null
  }

【问题讨论】：

尝试将路径中的点放到href="/manifest.json"
@LGSon 我之前试过 :(
尝试将Scope 替换为scope。我认为它区分大小写。
好吧，路径中不应该是一个点，所以请确保没有，而且清单的文件扩展名实际上应该是.webmanifest（尽管有些浏览器支持其他浏览器作为好吧），所以也尝试一下，像这样<link rel="manifest" href="/manifest.webmanifest"> ...并确保实际文件也被重命名，并且存储在wwwroot文件夹中。跨度>

标签： javascript google-chrome-devtools manifest pwa

【解决方案1】：

确保 index.html 和 manifest.json 都在同一个文件夹中，如下所示，

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

如果没有指向您网站的实际链接，这就是我们可以为给定代码提供的所有调试。如果这不能解决问题，请发布您的网络选项卡的屏幕截图以了解 manifest.json 发生了什么。

【讨论】：

【解决方案2】：

尝试浏览清单 https://yourweb/manifest.json 或 .webmanifest

如果 KO 添加以下内容：

在您的服务器配置中添加 .json mime 类型 .json |应用程序/json
或将 manifest.json 重命名为 manifest.webmanifest .webmanifest |应用程序/清单+json

如果可以，请查看 Application then Manifest 下的开发工具

【讨论】：