我正在尝试在最新的Chrome&安卓系统(7)。我在清单文件中指定了"独立"，但该应用程序仅在浏览器中打开。我以前在同一台设备上得到过想要的行为，但似乎无法再现
我看到有人在这个问题上也有类似的问题。我遵循了建议的解决方案——用Lighthouse验证PWA属性——但即使Lighthouse的分数达到了完美的100分，我仍然无法让应用程序在独立模式下打开。
有什么想法吗？
我的参考代码(也在GitHub和GitHub页面上)：
Index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>A2HS Test</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#0077c2"/>
<link rel="manifest" href="manifest.json">
</head>
<body>
<p>Add To Home Screen</p>
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('sw.js')
.then(reg => console.log('Registration success. Scope is ', reg.scope))
.catch(err => console.log('Registration failed. ', err));
}
</script>
</body>
</html>
sw.js
const cacheName = 'a2hs-test';
const resourcesToCache = [
'index.html',
'manifest.json',
'icons/icon-512.png',
'icons/icon-256.png',
'icons/icon-96.png',
];
self.addEventListener('install', function(event) {
event.waitUntil(
caches.open(cacheName).then(function(cache) {
return cache.addAll(resourcesToCache);
})
);
});
self.addEventListener('fetch', function(event) {
event.respondWith(
caches.match(event.request).then(function(response) {
return response || fetch(event.request);
})
);
});
manifest.json
{
"short_name": "A2HS",
"name": "Add To Home Screen",
"theme_color": "#0077c2",
"background_color": "#42a5f5",
"start_url": "index.html",
"display": "standalone",
"icons": [
{
"src": "icons/icon-96.png",
"sizes": "96x96"
},
{
"src": "icons/icon-256.png",
"sizes": "256x256"
},
{
"src": "icons/icon-512.png",
"sizes": "512x512"
}
]
}
编辑：
我在v63&Canary v66，并且似乎使用localhost导致了同样的问题——无法独立启动。托管完全相同的代码并访问HTTPS网站使我能够独立启动。
根据评论，这似乎只是Chrome 63+中修复的一个错误。
编辑：
请参阅上面的编辑-通过HTTPS托管也为我解决了v63和Canary v66上的相同问题。Localhost可能不足以允许应用程序以独立模式启动。
我发现的一个解决方案是在远程设备下使用开发人员工具中的代理。您必须使用USB电缆连接设备并代理应用程序，这样您也可以使用localhost。