2015-10-28 3 views
0

Я следую очень простому баннеру установки приложений для Chrome 42+, используя инструкции here, но это не отображается. Сервис работник зарегистрирован, сервер работает по протоколу HTTPS, а manifest.json выглядит следующим образом:Chrome Web App Install Banners Not Working

{ 
    "name": "appName", 
    "short_name": "appName", 
    "start_url": "./index.html", 
    "display": "standalone", 
    "icons": [{ 
     "src": "/static/img/app/launcher-icon-1x.png", 
     "sizes": "48x48", 
     "type": "image/png" 
    },{ 
     "src": "/static/img/app/launcher-icon-2x.png", 
     "sizes": "96x96", 
     "type": "image/png" 
    },{ 
     "src": "/static/img/app/launcher-icon-3x.png", 
     "sizes": "144x144", 
     "type": "image/png" 
    },{ 
     "src": "/static/img/app/launcher-icon-4x.png", 
     "sizes": "192x192", 
     "type": "image/png" 
    }] 
} 

Service Worker зарегистрирован используя следующий код:

window.addEventListener('load', function() { 
    var outputElement = document.getElementById('output'); 
    navigator.serviceWorker.register('/static/service-worker.js', { 
      scope: './static/' 
     }) 
     .then(function (r) { 
      console.log('Registered Service Worker'); 
     }) 
     .catch(function (whut) { 
      console.error('Uh oh, there is a problem... '); 
      console.error(whut); 
     }); 
    window.addEventListener('beforeinstallprompt', function (e) { 
     outputElement.textContent = 'beforeinstallprompt Event fired'; 
    }); 
}); 

Что я упускаю? Не уверен, где начать. Я также включил chrome://flags/#bypass-app-banner-engagement-checks в настройках Chrome.

Одна вещь, которую я должен отметить, это то, что я использую Flask, поэтому я задаюсь вопросом, не являются ли пути неправильными. Я думаю, что проблема start_url. Я указываю на папку templates в Flask? Потому что здесь находится файл index.html. Пробовал, но не работал.

+0

Ну, у меня была опечатка. 'display' не был в кавычках в' manifest.json'. Но до сих пор не повезло. – mapr

+1

Пока вы регистрируете сервисного работника, уверены ли вы, что рабочий-сервис фактически контролирует вашу страницу? Попытайтесь оставить значение «scope», чтобы использовать поведение по умолчанию «тот же самый каталог-как-SW», и если ваш SW используется из '/ static /', то ваши страницы также должны быть. Вы можете проверить, является ли SW или не контролирует вашу страницу, введя 'navigator.serviceWorker.controller.state' в консоли DevTools. –

+0

К счастью, я столкнулся с этим вопросом: http://stackoverflow.com/questions/30256390/navigator-serviceworker-controller-is-always-null и решил. Состояние ServiceWorker активировано. Но баннер еще не появился. – mapr

ответ

0

Добавить это 3 элемента на манифесте (MOZ Reference)

"related_applications": [{ 
     "platform": "web" 
    }], 
"related_applications": [], 
"prefer_related_applications": false 

Тогда ваш манифест результат

{ 
    "name": "appName", 
    "short_name": "appName", 
    "start_url": "./index.html", 
    "display": "standalone", 
    "icons": [{ 
     "src": "/static/img/app/launcher-icon-1x.png", 
     "sizes": "48x48", 
     "type": "image/png" 
    },{ 
     "src": "/static/img/app/launcher-icon-2x.png", 
     "sizes": "96x96", 
     "type": "image/png" 
    },{ 
     "src": "/static/img/app/launcher-icon-3x.png", 
     "sizes": "144x144", 
     "type": "image/png" 
    },{ 
     "src": "/static/img/app/launcher-icon-4x.png", 
     "sizes": "192x192", 
     "type": "image/png" 
    }], 
    "related_applications": [{ 
      "platform": "web" 
     }], 
    "related_applications": [], 
    "prefer_related_applications": false 
} 

Если у вас есть проблемы, опубликовать свою ошибку и я могу помочь вам, я надеюсь, что это поможет!