Сервисный работник для адаптивного веб-сайта - PullRequest
Новая
       19

Сервисный работник для адаптивного веб-сайта

0 голосов
/ 20 февраля 2019

У нас есть адаптивный веб-сайт на основе пользовательского агента.Я создал простой рабочий сервис для показа страницы offline.html, когда нет соединения.

Это прекрасно работает на настольных компьютерах и мобильных устройствах. Но если я выберу Показать как рабочий стол на Android Chrome, то сайт будет отображаться в виде мобильного макета, а не на рабочем столе.При отладке я обнаружил, что в запросе сервера пользовательский агент не изменился.

Если попытка изменить пользовательский агент на рабочем столе, то также работает нормально.

Есть идеи, что может быть не так?Сайт www.idealno.ba

Это работник службы: 

    //This is the "Offline page" service worker

//Install stage sets up the offline page in the cache and opens a new cache
self.addEventListener('install', function (event) {
  var offlinePage = new Request('offline.html');
  event.waitUntil(
    fetch(offlinePage).then(function (response) {
      return caches.open('pwa-offline').then(function (cache) {
        console.log('[PWA] Cached offline page during Install' + response.url);
        return cache.put(offlinePage, response);
      });
    }));
});

//If any fetch fails, it will show the offline page.
//Maybe this should be limited to HTML documents?
self.addEventListener('fetch', function (event) {
  if (event.request.mode === 'navigate' ||
  (event.request.method === 'GET' &&
    event.request.headers.get('accept').includes('text/html'))) {
    event.respondWith(
      fetch(event.request).catch(function(error) {
          console.error('[PWA] Network request Failed. Serving offline page ' + error);
          return caches.open('pwa-offline').then(function(cache) {
            return cache.match('offline.html');
          });
        }
      ));
  }
});

//This is a event that can be fired from your page to tell the SW to update the offline page
self.addEventListener('refreshOffline', function (response) {
  return caches.open('pwa-offline').then(function (cache) {
    console.log('[PWA] Offline page updated from refreshOffline event: ' + response.url);
    return cache.put(offlinePage, response);
  });
});

Я также пытался изменить user-agent в заголовке, и он не работает.Добавление пользовательского значения заголовка работает .. 

fetch(event.request, {
        credentials: 'include', headers: {
          "User-Agent": "blbbbb",
          'X-My-Custom-Header': 'test' 
        } })
...