Question

我的本地主机服务器在root文件夹中运行，而我的webapp文件夹位于此root文件夹中。

http://127.0.0.1:8887/ - ＆gt; root

http://127.0.0.1:8887/webapp - ＆gt; root/webapp

webapp包含index.html，它链接到同一文件夹中的manifest.json文件。

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

Chrome在此设置中未检测到webapp的清单文件。

仅当manifest.json文件夹中启动了localhost服务器时才会检测到

webapp。

http://127.0.0.1:8887/ - ＆gt; webapp

我希望它以其他方式工作，怎么做？

mainfest.json

{
    "name": "Web app",
    "short_name": "Web app",
    "icons": [{
      "src": "icons/icon-128x128.png",
        "sizes": "128x128",
        "type": "image/png"
      }, {
        "src": "icons/icon-144x144.png",
        "sizes": "144x144",
        "type": "image/png"
      }, {
        "src": "icons/icon-152x152.png",
        "sizes": "152x152",
        "type": "image/png"
      }, {
        "src": "icons/icon-192x192.png",
        "sizes": "192x192",
        "type": "image/png"
      }, {
        "src": "icons/icon-256x256.png",
        "sizes": "256x256",
        "type": "image/png"
      }],
    "start_url": "/webapp/",
    "scope":"/webapp/",
    "display": "standalone",
    "background_color": "#3E4EB8",
    "theme_color": "#2F3BA2"
  }

Answer 1

1）HTTPS is required让PWA工作。拥有有效证书也可以避免证书验证问题。您可以使用以下命令为本地生成一个。

openssl req -newkey rsa:2048 -new -nodes -x509 -days 3650 -keyout key.pem -out cert.pem

2）当index.html和manifest.json都在同一个文件中时，你可以在没有＆＃34;的情况下链接到它。＆＃34;如下。由于Web服务器在解决路径方面存在差异，因此有时会出现这种情况。是的，理想的＆＃34;。＆＃34;应该参考当前文件夹。但值得尝试让您的本地服务器正常工作。

3）不确定您使用的是哪种Web服务器。你最终需要一个支持服务工作者（有些像ng服务在Angular不支持服务工作者）。 http-server是个不错的选择。

安装 - ＆gt; npm install http-server -g

在构建文件夹中运行此命令 - ＆gt;

http-server -o -i 172.22.49.205 -p 8080 -S

3）如果您使用Chrome开发者工具 - ＆gt;申请 - ＆gt;清单，如果它显示＆＃34;没有检测到清单＆＃34;，那么你可以确定清单，如果没有出现，上述之一可能有助于解决它。

未检测到子目录中的Web应用程序的manifest.json

1 个答案: