2

我在我的網站中實施了PWA,安裝橫幅僅出現在第一次訪問,我關閉後(不添加它),並通過URL再次刷新或重新訪問,橫幅沒有再次出現,除非我清除我的歷史記錄和緩存,爲什麼?Progressive Web App安裝橫幅僅在第一次訪問時顯示

這裏是我的清單

{ 
    "name": "Mobipaid", 
    "short_name": "Mobipaid", 
    "theme_color": "#00497e", 
    "background_color": "#ffffff", 
    "icons": [{ 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-32x32.png", 
     "sizes": "32x32", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-48x48.png", 
     "sizes": "48x48", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-64x64.png", 
     "sizes": "64x64", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-72x72.png", 
     "sizes": "72x72", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-96x96.png", 
     "sizes": "96x96", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-128x128.png", 
     "sizes": "128x128", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-144x144.png", 
     "sizes": "144x144", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-152x152.png", 
     "sizes": "152x152", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-180x180.png", 
     "sizes": "180x180", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-192x192.png", 
     "sizes": "192x192", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-200x200.png", 
     "sizes": "200x200", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-384x384.png", 
     "sizes": "384x384", 
     "type": "image/png" 
    }, 
    { 
     "src": "./MOSQUITO_2015/img/mobipaid/mobipaid-logo-white-background-512x512.png", 
     "sizes": "512x512", 
     "type": "image/png" 
    }], 
    "start_url": "/?utm_source=homescreen", 
    "display": "standalone" 
} 

,這裏是我的服務人員

var staticCacheName = 'mobipaid'; 
var filesToCache = [ 
'/MOSQUITO_2015/assets/', 
'/MOSQUITO_2015/css/', 
'/MOSQUITO_2015/fonts/', 
'/MOSQUITO_2015/img/' 
]; 

self.addEventListener('install', function(event) { 
    event.waitUntil(
    caches.open(staticCacheName).then(function(cache) { 
     return cache.addAll(filesToCache); 
    }) 
    ); 
}); 

self.addEventListener('push', function(event) { 
    const title = 'Mobipaid'; 
    const options = { 
    body: event.data.text(), 
    icon: './MOSQUITO_2015/img/logo.png', 
    badge: '/MOSQUITO_2015/img/logo.png' 
    }; 

    const notificationPromise = self.registration.showNotification(title, options); 
    event.waitUntil(notificationPromise); 
}); 

self.addEventListener('notificationclick', function(event) { 
    event.notification.close(); 

    const notificationPromise = clients.openWindow('./merchant/transaction/transaction_log'); 
    event.waitUntil(notificationPromise); 
}); 

self.addEventListener('activate', function(event) { 
    event.waitUntil(
    caches.keys().then(function(cacheNames) { 
     console.log('Activate event - cacheNames: ', cacheNames); 
     return Promise.all(
     cacheNames.filter(function(cacheName) { 
     }).map(function(cacheName) { 
      return caches.delete(cacheName); 
     }) 
     ); 
    }) 
    ); 
}); 


self.addEventListener('fetch', function(event) { 
    event.respondWith(fetch(event.request)); 
}); 

有什麼,我錯過?

+0

我認爲你的代碼是正確的。但是在檢查這個相關的[SO帖子](https://stackoverflow.com/a/43003443/5995040)後,如果你的網頁應用程序被添加到你的主屏幕上,「並不需要等待提示我添加了很多我傾向於每天使用我的主屏幕的網站,而且我幾乎沒有看到過橫幅!「希望這可以幫助。 –

+0

您關閉了PWA安裝橫幅? – abraham

回答