在开发Progressive-Web-App时，发生了以下问题：
- 独立模式在不包括service worker的情况下可以完美工作-但不适用于。*
- 如果没有Service-Worker a2 hs（添加到主屏幕），PWA将在
"standalone"模式下正确启动。 - 添加服务工人后（a2 hs+安装/ Web-APK）PWA在新的Chrome窗口中打开新的选项卡。
Chrome-PWA-Audit：
x1c 0d1x的数据
login_移动的_tablet.jsf / include service worker：
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('../serviceWorker.js', {scope: "/application/"})
/* also tried ".", "/", "./" as scope value */
.then(function(registration) {
console.log('Service worker registration successful, scope is: ', registration.scope);
})
.catch(function(error) {
console.log('Service worker registration failed, error: ', error);
});
}
</script>字符串
serviceWorker.js：
var cacheName = 'pwa-cache';
// A list of local resources we always want to be cached.
var filesToCache = [
'QS1.xhtml',
'pdf.xhtml',
'QS1.jsf',
'pdf.jsf',
'login_pages/login_mobile_tablet.jsf',
'login_pages/login_mobile_tablet.xhtml'
];
// The install handler takes care of precaching the resources we always need.
self.addEventListener('install', function(event) {
event.waitUntil(
caches.open(cacheName).then(function(cache) {
return cache.addAll(filesToCache);
})
);
})
// The activate handler takes care of cleaning up old caches.
self.addEventListener('activate', event => {
event.waitUntil(self.clients.claim());
});
// The fetch handler serves responses for same-origin resources from a cache.
self.addEventListener('fetch', event => {
// Workaround for error:
// TypeError: Failed to execute 'fetch' on 'ServiceWorkerGlobalScope': 'only-if-cached' can be set only with 'same-origin' mode
// see: https://stackoverflow.com/questions/48463483/what-causes-a-failed-to-execute-fetch-on-serviceworkerglobalscope-only-if
if (event.request.cache === 'only-if-cached' && event.request.mode !== 'same-origin')
return;
event.respondWith(
caches.match(event.request, {ignoreSearch: true})
.then(response => {
return response || fetch(event.request);
})
);
});型
manifest.json：
{
"name":"[Hidden]",
"short_name":"[Hidden]",
"start_url":"/application/login_pages/login_mobile_tablet.jsf",
"scope":".",
"display":"standalone",
"background_color":"#4688B8",
"theme_color":"#4688B8",
"orientation":"landscape",
"icons":[
{
"src":"javax.faces.resource/images/icons/qsc_128.png.jsf",
"sizes":"128x128",
"type":"image/png"
},
{
"src":"javax.faces.resource/images/icons/qsc_144.png.jsf",
"sizes":"144x144",
"type":"image/png"
},
{
"src":"javax.faces.resource/images/icons/qsc_152.png.jsf",
"sizes":"152x152",
"type":"image/png"
},
{
"src":"javax.faces.resource/images/icons/qsc_192.png.jsf",
"sizes":"192x192",
"type":"image/png"
},
{
"src":"javax.faces.resource/images/icons/qsc_256.png.jsf",
"sizes":"256x256",
"type":"image/png"
},
{
"src":"javax.faces.resource/images/icons/qsc_512.png.jsf",
"sizes":"512x512",
"type":"image/png"
}
]
}型
考虑了以下问题/答案-但未找到解决方案：
2条答案
按热度按时间gzszwxb41#
当您添加Service-Worker（沿着所有其他PWA要求）时，您的应用程序将被创建为真实的PWA -并安装Web-APK。因此，您还需要使用Default-HTTPS-Port 443 -确保您使用有效的HTTPS证书。
在添加Service-Worker之前，这个强制性需求是缺失的，因此您的PWA没有安装，因此需要在
"standalone-mode"中显示较少的其他需求。这只是一个遗憾，这是无处记录.我们不得不“发现”为自己。
短名单的强制性要求“可安装的网络APK”：
(As我们找不到完整的列表，我尝试包括所有点）
csga3l582#
我运行了很多个小时，并检查了所有内容，包括正确的assetlinks密钥是从
./well-known/assetlinks.json提供给我的网站的，没有任何工作。最后，我测试了我的网站对https://developers.google.com/digital-asset-links/tools/generator。我已经使用微软的PWABuilder UI为我生成APK，结果发现我在指定主机时，在我的网站名称中缺少一个“www”。正确主机：www.mywebsite.com
主机错误：mywebsite.com
希望这能帮助到别人。