I've created a Progressive Web App. It's simple, just an index.html, a folder "images" with favicon etc, a sw.js et a styles.css
My code from 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"
}
and 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;
});
});
}
})
);
});
So... for now, when I go to the site from my smartphone with chrome, everything is displayed correctly, the tab color is good, everythings looks good etc. But I do not have the banner "add to the home screen". By cons when I go in the settings of chrome, and I click on "Add to the home screen" and I validate and then I go to the added shortcut, the site is launched as an app, with the "splash screen" etc.
And when I go on the site from my computer and I watch the debugger in "Application" and manifest, I have the little link "Add to the home screen" Do you know where this may come from ?
Thanks for help !
Edit :
I have advanced a little I modified a little my organization, I created a subdomain, I now have a URL like this: https://subdomain.example.com. Everything is at the root of the subdomain, in the code, the links are in relative (e.g.: "img / name.png"). I do not have any errors in the service worker, when I go on Chrome from my pc, I go to dev tools -> Application -> Manifest tab, and I click on "Add to home screen", the banner to add the site to applications appears well and when I validate, it works well. That's what I have when I go on Chrome dev tools -> Application -> Service worker tab
But on my smartphone, I still don't have the banner offering add to home screen, if someone has an idea...
