Google chrome PWA：铬警告“；服务人员没有'；获取'；“处理者”；

我目前试图使我的PWA可安装，但未成功。我已经注册了一个SertviceWorker并链接了一个清单，同时我正在监听beforeInstallPromt事件

我的ServiceWorker正在侦听任何

fetch

事件

我的问题是，在Chrome桌面上刚刚显示了created beforeInstall横幅，但在移动设备上，我在Chrome检查选项卡“应用程序”的“清单”部分收到一条警告：

你可以在上面查看消息

manifest.json

{"name":"TestApp","short_name":"TestApp","start_url":"https://testapp.ga/loginCheck","icons":[{"src":"https://testapp.ga/assets/icons/launcher-ldpi.png","sizes":"36x36","density":0.75},{"src":"https://testapp.ga/assets/icons/launcher-mdpi.png","sizes":"48x48","density":1},{"src":"https://testapp.ga/assets/icons/launcher-hdpi.png","sizes":"72x72","density":1.5},{"src":"https://testapp.ga/assets/icons/launcher-xhdpi.png","sizes":"96x96","density":2},{"src":"https://testapp.ga/assets/icons/launcher-xxhdpi.png","sizes":"144x144","density":3},{"src":"https://testapp.ga/assets/icons/launcher-xxxhdpi.png","sizes":"192x192","density":4},{"src":"https://testapp.ga/assets/icons/launcher-web.png","sizes":"512x512","density":10}],"display":"standalone","background_color":"#ffffff","theme_color":"#0288d1","orientation":"any"}

服务人员：

//This array should NEVER contain any file which doesn't exist. Otherwise no single file can be cached.
var preCache=[
  '/favicon.png',
  '/favicon.ico',
  '/assets/Bears/bear-standard.png',
  '/assets/jsInclude/mathjax.js',
  '/material.js',
  '/main.js',
  'functions.js',
  '/material.css',
  '/materialcolors.css',
  '/user.css',
  '/translations.json',
  '/roboto.css',
  '/sw.js',
  '/'
];
//Please specify the version off your App. For every new version, any files are being refreched.
var appVersion="v0.2.1";
//Please specify all files which sould never be cached
var noCache=[
  '/api/'
];

//On installation of app, all files from preCache are being stored automatically.
self.addEventListener('install', function(event) {
  event.waitUntil(
      caches.open(appVersion+'-offline').then(function(cache) {
          return cache.addAll(preCache).then(function(){
            console.log('mtSW: Given files were successfully pre-cached')
          });
      })
  );
});

function shouldCache(url) {
    //Checking if url is market as noCache
    var isNoCache=noCache.includes(url.substr(8).substr(url.substr(8).indexOf("/")))||noCache.includes((url.substr(8).substr(url.substr(8).indexOf("/"))).substr(0,(url.substr(8).substr(url.substr(8).indexOf("/"))).indexOf("?")));
    //Checking of hostname of request != current hostname
    var isOtherHost=url.substr(8).substr(0,url.substr(8).indexOf("/"))!=location.hostname&&url.substr(7).substr(0,url.substr(7).indexOf("/"))!=location.hostname;
    return((url.substr(0,4)=="http"||url.substr(0,3)=="ftp") && isNoCache==false && isOtherHost==false);
}
//If any fetch fails, it will look for the request in the cache and serve it from there first
self.addEventListener('fetch', function(event) {
  //Trying to answer with "online" version if fails, using cache.
  event.respondWith(
    fetch(event.request).then(function (response) {
      if(shouldCache(response.url)) {
        console.log('mtSW: Adding file to cache: '+response.url);
        caches.open(appVersion+'-offline').then(function(cache) {
        cache.add(new Request(response.url));
    });
      }
      return(response);
    }).catch(function(error) {
      console.log( 'mtSW: Error fetching. Serving content from cache: ' + error );

      //Check to see if you have it in the cache
      //Return response
      //If not in the cache, then return error page
      return caches.open(appVersion+'-offline').then(function (cache) {
        return cache.match(event.request).then(function (matching) {
          var report =  !matching || matching.status == 404?Promise.reject('no-match'): matching;
          return report
        });
      });
    })
  );
})

我检查了

mtShowInstallButton

功能。它完全可以在桌面上工作

---

这是什么意思？在桌面上，我从来没有收到过这个警告，只是在使用手持设备/模拟器时。

Fetch函数用于获取JSon清单文件。再次尝试阅读谷歌文档。 要在Mobile中添加PWA，您需要获取清单文件，该文件是使用服务工作者使用fetch函数获取的

代码如下：

    fetch('examples/example.json')
.then(function(response) {
  // Do stuff with the response
})
.catch(function(error) {
  console.log('Looks like there was a problem: \n', error);
});

---

有关获取和清单的更多信息。

您能否编辑您的问题并添加清单和服务人员代码？这对任何试图帮助您的人都很有用。好主意，但我的清单是通过数据URI加载base64编码的。所以它实际上不是由我的服务人员获取的。为什么是base64 uri？您必须将清单文件与sw.js保存在同一文件夹中。这意味着服务工作者没有任何清单文件。试着用服务工人的身体保持它。js。如果你没有得到后，这也尝试我的文章pwa。清单是由客户端JS生成的，因为它依赖于用户设备和首选项。@JasMich.de您是否找到了解决方案？我的处境与此完全相同。

//This array should NEVER contain any file which doesn't exist. Otherwise no single file can be cached.
var preCache=[
  '/favicon.png',
  '/favicon.ico',
  '/assets/Bears/bear-standard.png',
  '/assets/jsInclude/mathjax.js',
  '/material.js',
  '/main.js',
  'functions.js',
  '/material.css',
  '/materialcolors.css',
  '/user.css',
  '/translations.json',
  '/roboto.css',
  '/sw.js',
  '/'
];
//Please specify the version off your App. For every new version, any files are being refreched.
var appVersion="v0.2.1";
//Please specify all files which sould never be cached
var noCache=[
  '/api/'
];

//On installation of app, all files from preCache are being stored automatically.
self.addEventListener('install', function(event) {
  event.waitUntil(
      caches.open(appVersion+'-offline').then(function(cache) {
          return cache.addAll(preCache).then(function(){
            console.log('mtSW: Given files were successfully pre-cached')
          });
      })
  );
});

function shouldCache(url) {
    //Checking if url is market as noCache
    var isNoCache=noCache.includes(url.substr(8).substr(url.substr(8).indexOf("/")))||noCache.includes((url.substr(8).substr(url.substr(8).indexOf("/"))).substr(0,(url.substr(8).substr(url.substr(8).indexOf("/"))).indexOf("?")));
    //Checking of hostname of request != current hostname
    var isOtherHost=url.substr(8).substr(0,url.substr(8).indexOf("/"))!=location.hostname&&url.substr(7).substr(0,url.substr(7).indexOf("/"))!=location.hostname;
    return((url.substr(0,4)=="http"||url.substr(0,3)=="ftp") && isNoCache==false && isOtherHost==false);
}
//If any fetch fails, it will look for the request in the cache and serve it from there first
self.addEventListener('fetch', function(event) {
  //Trying to answer with "online" version if fails, using cache.
  event.respondWith(
    fetch(event.request).then(function (response) {
      if(shouldCache(response.url)) {
        console.log('mtSW: Adding file to cache: '+response.url);
        caches.open(appVersion+'-offline').then(function(cache) {
        cache.add(new Request(response.url));
    });
      }
      return(response);
    }).catch(function(error) {
      console.log( 'mtSW: Error fetching. Serving content from cache: ' + error );

      //Check to see if you have it in the cache
      //Return response
      //If not in the cache, then return error page
      return caches.open(appVersion+'-offline').then(function (cache) {
        return cache.match(event.request).then(function (matching) {
          var report =  !matching || matching.status == 404?Promise.reject('no-match'): matching;
          return report
        });
      });
    })
  );
})

    fetch('examples/example.json')
.then(function(response) {
  // Do stuff with the response
})
.catch(function(error) {
  console.log('Looks like there was a problem: \n', error);
});