8

我的 localhost 服务器在root文件夹中运行,我的webapp文件夹位于该root文件夹中。

http://127.0.0.1:8887/ ->root

http://127.0.0.1:8887/webapp ->root/webapp

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

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

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

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

http://127.0.0.1:8887/ ->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"
  }
4

1 回答 1

4

1) PWA需要 HTTPS才能工作。还拥有有效的证书将避免证书验证问题。您可以使用以下命令为本地生成一个。

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

2) 当 index.html 和 manifest.json 都在同一个文件中时,你可以不带“.”链接到它。如下所示。有时可能是由于 Web 服务器在解决路径方面的差异。是的,理想情况下是“。” 不过应该参考当前文件夹。但是值得尝试让您的本地服务器正常工作。

3) 不确定您使用的是什么网络服务器。你最终会需要一个支持服务工作者(Angular 中的 ng serve 等一些还不支持服务工作者)。http-server是一个不错的选择。

安装 -> npm install http-server -g

在您的构建文件夹中运行此命令->

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

3)如果您转到 Chrome 开发者工具 -> 应用程序 -> 清单,并且如果它显示“未检测到清单”,那么如果没有出现,那么您可以确定清单,并且上述之一可能有助于修复它。

于 2018-04-02T15:27:49.917 回答