service-worker


Service worker's offline caching is not working if I add my PWA on home screen


I made a PWA. Currently is deployed on heroku. URL - https://plain-js-pwa.herokuapp.com/.
My PWA installs service worker and manifest.json file. If I open it on chrome on mobile phone and put my phone on flight mode, then refreshing the url still gives shows me my application. Its expected as my service worker is doing offline caching.
But when I add my PWA to home screen, and try to open it on flight mode then it doesn't work. This is probably my first PWA, so please help me. I am generating my service worker file from 'sw-precache-webpack-plugin'.
My manifest.json file is:
{
"name": "VanillaJS-webpack App",
"short_name": "VanillaJS-webpack App",
"description": null,
"dir": "auto",
"lang": "en-US",
"display": "standalone",
"orientation": "any",
"start_url": "/?homescreen=1",
"background_color": "#ee6e73",
"icons": [
{
"src": "android-chrome-36x36.png",
"sizes": "36x36",
"type": "image/png"
},
{
"src": "android-chrome-48x48.png",
"sizes": "48x48",
"type": "image/png"
},
{
"src": "android-chrome-72x72.png",
"sizes": "72x72",
"type": "image/png"
},
{
"src": "android-chrome-96x96.png",
"sizes": "96x96",
"type": "image/png"
},
{
"src": "android-chrome-144x144.png",
"sizes": "144x144",
"type": "image/png"
},
{
"src": "android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/android-chrome-256x256.png",
"sizes": "256x256",
"type": "image/png"
},
{
"src": "/android-chrome-384x384.png",
"sizes": "384x384",
"type": "image/png"
},
{
"src": "/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
]
}

Related Links

How much is the lifetime of a Service Worker, can it be controlled?
How can a initialize sw-precache with all site pages
How to test service worker background sync
service worker and client requests 'Cache-control': 'no-cache'
Service worker - get push data from my server
ServiceWorker not receiving fetch requests
how to add script in <head> section of prestashop
How to configure create-react-pwa with nested homepage (localhost/app)
Fetching cached objects in ServiceWorker - Failed
Service Worker cache busting
How to deploy updates to service workers running on customers' sites?
Permanently registered service workers
Service-worker and tracking
Service worker sync fires only the first time
Pass custom data to service worker sync?
Service worker update only changed content in cache, or share data between service workers

Categories

HOME
django
localization
ecmascript-6
themes
apache-spark-mllib
settings
x264
data-visualization
odoo-8
discrete-mathematics
syntaxnet
project
google-schemas
java.util.logging
opengl-es-3.0
scrolltop
magnetic-cards
symbol
red5
google-data-studio
cfml
enterprise-miner
libigl
inno-download-plugin
angular-routing
interpreter
amazon-quicksight
mat
android-things
sinch
paperjs
sqlpackage
event-flow
dst
kudu
weather
linkedhashmap
hard-drive
gojs
joomla2.5
reactjs.net
numpy-broadcasting
raft
latitude-longitude
ideascript
sessionstorage
password-protection
cin
opensmpp
c9.io
hackintosh
visa
puredata
xbmc
convex-optimization
corruption
page-replacement
magic-draw
amq
scalding
er-diagram
pdf-conversion
gameplay-kit
nikeplus-api
pre-build-event
nservicebus5
tracker-enabled-dbcontext
decimalformat
xenomai
video-player
rubaxa-sortable
mod-proxy
airbrake
git-ftp
uvc
dot.js
cosine-similarity
pseudo-class
crowd
psr-4
universal-image-loader
strawberry-perl
buffering
renderer
fpdi
decoupling
drupal-nodes
gwt-openlayers
mysql-error-1044
rolify
kaleidoscope
epiceditor
video-codecs
fb.ui
apache-abdera
device-width
redis-py
subgraph
database-create
ilasm
jquery-tools
saxparseexception
promotion-code
qtabbar

Resources

Mobile Apps Dev
Database Users
javascript
java
csharp
php
android
MS Developer
developer works
python
ios
c
html
jquery
RDBMS discuss
Cloud Virtualization
Database Dev&Adm
javascript
java
csharp
php
python
android
jquery
ruby
ios
html
Mobile App
Mobile App
Mobile App