manifest.json 无法加载图标文件

Question

所以我的设置如下：

• 部署https://sub.domain.com/folder/在 Azure Blob 存储中的静态网站 (mkdocs) ，在 Kestrel 上运行。
• 在localhost:port没有子域和文件夹的情况下进行本地测试。
• <link rel="manifest" type="application/manifest+json" href="manifest.json" crossorigin="use-credentials">并且文件/folder/处于已部署状态，在本地测试中处于 root 状态。
• <script type="text/javascript" src="sw.js"></script>并且文件/folder/处于已部署状态，在本地测试中处于 root 状态。
• 清单中的 start_url 是/folder/.
• 在清单是图标路径assets/icons/icon.png，assets是/folder/在展开状态下，在局部测试根。

图标在本地工作，但在部署的站点上我得到：

Icon https://sub.domain.com/folder/assets/icons/icon.png failed to load

当我直接访问该 URL 时，文件加载得很好。

该站点位于身份验证之后，但我crossorigin="use-credentials"在加载清单时使用。

完整的 manifest.json：

{
    "short_name": "Site Hub",
    "name": "Site Hub",
    "start_url": "/docs/?utm_source=web_app_manifest",
    "icons": [
        {
            "src": "assets/icons/manifest-icon-192.png",
            "sizes": "192x192",
            "type": "image/png"
        },
        {
            "src": "assets/icons/manifest-icon-512.png",
            "sizes": "512x512",
            "type": "image/png"
        }
    ],
    "display": "standalone",
    "orientation": "portrait",
    "theme_color": "#20232A",
    "background_color": "#20232A"
}

我已经尝试过像./assets/icons/manifest-icon-512.png"以前一样的路径，但它也不起作用。

Answer 1

您可能应该使用 package.json 中的 homepage 选项来让您的应用程序知道它部署在https://sub.domain.com/folder。

像这样：

...
"homepage": "https://sub.domain.com/folder",
...