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

Using sw-toolbox with gulp
What is the purpose of service worker?
How to set BigPictureStyle on Web Push Notifications?
Best practice pattern for service worker background-sync with CSRF protection
When does code in a service worker outside of an event handler run?
Service worker JavaScript update frequency (every 24 hours?)
Can a service worker be updated thanks to a push event?
Service worker remote/foreign installation [duplicate]
Can a service worker detect history navigation?
How to access Cache.addAll() request array
Can users clear the service worker cache?
Multiple requests are being made from service worker to cache a resource
Should service worker script be loaded first?
What are the pros and cons of sw-toolbox's cacheFirst handler versus the fastest handler?
How to resolve Dynamic URLs dependencies through Service worker?
service-worker Is there a way to get informed if client quit?

Categories

HOME
url-redirection
phpword
prism
telegram
android-studio-2.2
zend-framework
swt
battery
error-handling
vscode-extensions
seo
carousel
rom
nuget-package
sendgrid-api-v3
commonjs
plist
startup
endpoint
android-intent
do-while
esoteric-languages
symfony-2.8
null-pointer
dreamweaver
production
swagger-2.0
symbols
breadth-first-search
poedit
r-mice
easeljs
exploit
perlbrew
surveymonkey
gpio
android-sharedpreferences
flooding
user-defined-functions
mql
vex
postback
fstream
papaparse
jett
hard-drive
openwhisk
sharepoint-workflow
swagger-php
reactivekit
ods
levenshtein-distance
parser-generator
preloader
chronicle-map
tcc
android-exoplayer
pom.xml
getchar
jboss-4.2.x
opengl-4
filehandle
taocp
mongodb-php
sklearn-pandas
createprocess
tfs-workitem
oracle-spatial
haskell-warp
kubuntu
cakephp-2.7
umlgraph
cryptographichashfunction
grouping-sets
delayed-execution
nodelist
iiop
primitive-types
spy++
universal-image-loader
personalization
rcaller
reflector
wxformbuilder
dot42
mutual-authentication
dsym
sphinxql
breakout
beaker-testing
cnf
asdf
diem
wp7test
apache-abdera
panda3d
paginator
appjs
entity-attribute-value
catransform3d
uipagecontrol
uideviceorientation
application-verifier
pagemethods
django-piston
firefox-3
product-management
dsoframer

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