我创建了一个渐进式 Web 应用程序。这很简单，只是一个 index.html、一个带有 favicon 等的文件夹“图像”、一个 sw.js 和一个 styles.css
我来自 manifest.json 的代码
{
"lang" : "en",
"name" : "Test",
"short_name" : "Test",
"icons" : [
{
"src": "images/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "images/android-chrome-144x144.png",
"sizes": "144x144",
"type": "image/png"
}
],
"theme_color" : "#116b20",
"background_color" : "#1a1a1a",
"scope" : "1",
"start_url" : "/test",
"display" : "standalone",
"orientation" : "natural"
}
和 sw.js
self.addEventListener('install', function(event) {
console.log('[Service Worker] Installing Service Worker ...', event);
event.waitUntil(
caches.open('static').then(function(cache) {
cache.addAll(['/test/', '/test/index.html', '/test/manifest.json']);
})
);
});
self.addEventListener('activate', function(event) {
console.log('[Service Worker] Activating Service Worker ....', event);
});
self.addEventListener('fetch', function(event) {
event.respondWith(
caches.match(event.request).then(function(response) {
if (response) {
return response;
} else {
return fetch(event.request).then(function(res) {
return caches.open('dynamic').then(function(cache) {
cache.put(event.request.url, res.clone());
return res;
});
});
}
})
);
});
所以......现在，当我从我的智能手机使用 chrome 访问该网站时，一切都正确显示，标签颜色很好，一切看起来都很好等等。但我没有“添加到主屏幕”的横幅。当我进入chrome的设置时，我点击“添加到主屏幕”并验证，然后我转到添加的快捷方式，该网站作为应用程序启动，带有“启动画面”等。
当我从我的计算机访问该站点并在“应用程序”和清单中观看调试器时，我有一个小链接“添加到主屏幕”你知道这可能来自哪里吗？
感谢帮助 ！
编辑 ：
我进步了一点，我修改了一点我的组织，我创建了一个子域，我现在有一个这样的 URL：https://subdomain.example.com。一切都在子域的根目录中，在代码中，链接是相对的（例如：“img / name.png”）。我的服务人员没有任何错误，当我从我的电脑上运行 Chrome 时，我转到开发工具 -> 应用程序 -> 清单选项卡，然后单击“添加到主屏幕”，添加站点的横幅到应用程序看起来很好，当我验证时，它运行良好。这就是我在 Chrome 开发工具 -> 应用程序 -> 服务工作者选项卡上所拥有的
但是在我的智能手机上，我仍然没有将横幅广告添加到主屏幕，如果有人有想法的话......