Installable Web Apps with the Web App Manifest in Chrome for Android not working

Question

Hello i'm getting this error:

Site cannot be installed: no matching service worker detected. You may need to reload the page, or check that the service worker for the current page also controls the start URL from the manifest

This is my manifest.json:

{
  "name": "SIMIC project",
  "short_name": "simic",
  "icons": [{
    "src": "images/simic-bn.png",
    "type": "image/png",
    "sizes": "32x32"
  },
  {
    "src": "images/simic-bn.png",
    "type": "image/png",
    "sizes": "144x144"
  }],
  "start_url": "/wta/",
  "display": "standalone",
  "background_color": "#ffffff",
  "theme_color": "#1e88e5"
}

This is my url: "mydomain:8889/wta/" and this is my code structure:

-mydomain

---wta

------css/

------font/

------images/

------js/

------index.html

------manifest.json

What am i missing? THX

jedijulia · Accepted Answer · 2017-09-05 03:36:15Z

7

In order for your web app to be installable / be added to the home screen, you need to meet the following requirements:

have a web app manifest file with a short_name, a name, an icon and a start_url (which you already have)
a service worker
it must be served over HTTPS

Currently you have the web app manifest file, but you need a service worker. A service worker is basically a Javascript file that intercepts network requests, caches your assets, can send push notifications, etc.

You can create this js file and register your service worker like so:

if ('serviceWorker' in navigator) {
    // register the service worker
    navigator.serviceWorker.register('service-worker.js')
        .then(function(reg){
            console.log("service worker registered");
        }).catch(function(err) {
            console.log("error: ", err)
        });
}

Note that this should be in the root folder for it to work for the entire site.

answered Sep 5, 2017 at 3:36

jedijulia

1261 silver badge2 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Valerio Marzulli Over a year ago

thaks for your answer! I understand what you say, but what do i have to write in my service worker? The code you wrote is just a js file pointing to service worker, isn't it? What does "service-worker.js" contains?

Valerio Marzulli Over a year ago

i followed this link: codelabs.developers.google.com/codelabs/add-to-home-screen/#5 ....i added this: "self.addEventListener('fetch', function(event) { });" in my service work file. It works fine!

Odusanya · Accepted Answer · 2017-09-05 01:01:37Z

0

You also need a service worker script to control your assets, offline-plugin should be a great option!

answered Sep 5, 2017 at 1:01

Odusanya

1

Collectives™ on Stack Overflow

Installable Web Apps with the Web App Manifest in Chrome for Android not working

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related