PWA 仅在 Chrome 桌面上运行？
PWA only runs in Chrome on Desktop?
创建了一个简单的 PWA，制作了清单文件和服务工作者，它在我的 iMac 上的 Chrome 中运行良好。查看控制台，我可以看到 Service Worker 已注册并且 运行ning 并且它可以识别清单文件。模拟网络丢失，它仍然 运行 就像它应该的那样。还好吧？
当我通过 HTTPS 提供它时，它在 phone 上的浏览器中打开时很好，并按应有的方式添加到主屏幕，但是当我尝试从图标 运行 它时在主屏幕上，我得到的只是一个空白的白色屏幕。
如果我删除该图标，然后通过 HTTP 连接提供它并将其保存到主屏幕，它会按照应有的方式执行所有操作，运行s 来自您放置在主屏幕上的图标 (当从 http 完成时）但当然不会 运行 离线。
我做错了什么？甚至不确定从哪里开始寻找！
问题可能出在您的 PWA 和 API 服务器之间的 HTTPS 请求的 CROS 访问来源。我的 PWA 也有同样的问题。它在 chrome 或桌面上运行良好，并且 运行 我第一次在移动 chrome 中打开它时运行良好，但是当服务工作者注册它时 return CROS 访问来源。
要调试此问题，我建议在您的移动设备上使用 chrome inspect。
你可以找到指南 here
检查
Access-Control-Allow-Origin
在 API 和 PWA 服务器之间。
您必须允许您的 PWA URL 访问 API 服务器。您可以使用 PWA URL 或 * 访问所有 URLs.
检查
Access-Control-Allow-Headers
在您的 API 服务器中。
如果您要在请求中发送身份验证或 cache-control header，则必须将它们添加到 Access-Control-Allow-Headers.
并且您的 PWA 和 API URL 必须具有有效的 SSL 证书。
另外，在 manifest.json
中检查 start_url
您必须在 start_url 中设置完整的 URL 包括协议，index.html 不是必需的。
创建了一个简单的 PWA，制作了清单文件和服务工作者，它在我的 iMac 上的 Chrome 中运行良好。查看控制台，我可以看到 Service Worker 已注册并且 运行ning 并且它可以识别清单文件。模拟网络丢失，它仍然 运行 就像它应该的那样。还好吧？
当我通过 HTTPS 提供它时，它在 phone 上的浏览器中打开时很好，并按应有的方式添加到主屏幕，但是当我尝试从图标 运行 它时在主屏幕上，我得到的只是一个空白的白色屏幕。
如果我删除该图标，然后通过 HTTP 连接提供它并将其保存到主屏幕，它会按照应有的方式执行所有操作，运行s 来自您放置在主屏幕上的图标 (当从 http 完成时）但当然不会 运行 离线。
我做错了什么？甚至不确定从哪里开始寻找！
问题可能出在您的 PWA 和 API 服务器之间的 HTTPS 请求的 CROS 访问来源。我的 PWA 也有同样的问题。它在 chrome 或桌面上运行良好，并且 运行 我第一次在移动 chrome 中打开它时运行良好，但是当服务工作者注册它时 return CROS 访问来源。 要调试此问题，我建议在您的移动设备上使用 chrome inspect。 你可以找到指南 here
检查
Access-Control-Allow-Origin
在 API 和 PWA 服务器之间。 您必须允许您的 PWA URL 访问 API 服务器。您可以使用 PWA URL 或 * 访问所有 URLs.
检查
Access-Control-Allow-Headers
在您的 API 服务器中。 如果您要在请求中发送身份验证或 cache-control header，则必须将它们添加到 Access-Control-Allow-Headers.
并且您的 PWA 和 API URL 必须具有有效的 SSL 证书。
另外，在 manifest.json
中检查 start_url您必须在 start_url 中设置完整的 URL 包括协议，index.html 不是必需的。