Questions tagged [service-worker]

A service worker is JavaScript code that, once registered with an associated origin and scope, will respond to browser-initiated events, even when the pages it controls are no longer open. By handling `fetch` events, service workers can provide custom network behavior, like offline support (via the Cache API). By handling `push` events, service workers can be "woken up" and display notifications.


4030 questions
40
votes
7 answers

Is it possible to make an in-app button that triggers the PWA "Add to Home Screen" install banner?

I understand that with a properly made Progressive Web App mobile browsers will display a banner prompting users to 'Install' the app on their home screen. I have been looking around for a way to trigger that prompt from within the app, but have not…
Adam D
  • 1,370
  • 1
  • 13
  • 29
40
votes
3 answers

What causes a Failed to execute 'fetch' on 'ServiceWorkerGlobalScope': 'only-if-cached' can be set only with 'same-origin' mode error?

After upgrading to Chrome 64, I realized that this error appears when I load my page on a new tab. I can't identify where it is on the service worker. Here is my code to run the fetch: self.addEventListener('fetch', function(event) { if…
N. Dias
  • 544
  • 1
  • 6
  • 11
40
votes
2 answers

How to use service workers in Cordova Android app?

I want to use a service worker in my Cordova Android add as a convenient way to sync some images to and from the server. I notice that this question states that this is not possible, since service workers must be loaded via https:, whereas Cordova…
user663031
39
votes
1 answer

What is this unknown Google-originating client that triggers JavaScript errors in our PWA?

We’re running Progressive Web Applications with push notifications enabled for Chrome and Samsung Internet, and encourage our users to add it to their home screen. We scrupulously log and monitor browser exceptions to preserve a high-quality…
36
votes
1 answer

When does code in a service worker outside of an event handler run?

(I am paraphrasing question asked by Rich Harris in the "Stuff I wish I'd known sooner about service workers" gist.) If I have code in my service worker that runs outside an event handler, when does it run? And, closely related to that, what is the…
Jeff Posnick
  • 45,379
  • 12
  • 113
  • 142
35
votes
3 answers

Vue PWA not getting new content after refresh

I'm new to Vue and created a project with the PWA Service-worker plugin. After deploying a new version of my App I get these messages in console: After refreshing the page (F5) these messages still appear the same way and the App is still in it's…
user5242820
35
votes
3 answers

Service Worker vs Shared Worker

What is the difference between Service Worker and Shared Worker? When should I use Service Worker instead of Shared Worker and vice versa?
Lewis
  • 11,912
  • 9
  • 59
  • 79
33
votes
1 answer

Best practices for detecting offline state in a service worker

I have a service worker that is supposed to cache an offline.html page that is displayed if the client has no network connection. However, it sometimes believes the navigator is offline even when it is not. That is, navigator.onLine === false. This…
Kaivosukeltaja
  • 14,583
  • 4
  • 37
  • 70
33
votes
2 answers

What is Service Worker Console? & Where is it in Chrome Browser?

I am working on push notifications and came upon an unfamiliar term: service worker console. I have read and used the term console log or web console in browser, but I am not familier with the term service worker console, and I didn't find…
33
votes
1 answer

Can I have multiple service workers both intercept the same fetch request?

I'm writing a library which I will provide for 3rd parties to run a service worker on their site. It needs to intercept all network requests but I want to allow them to build their own service worker if they like. Can I have both service workers…
owencm
  • 6,909
  • 4
  • 32
  • 52
32
votes
2 answers

Open installed PWA from external url

Is there any method to open website (PWA) urls in the installed PWA in iOS- Safari? Use case: I'm sending email links to login in my PWA, how can I make this url's open directly with the installed PWA instead of the browser?
32
votes
2 answers

How to handle routing in Angular 5+ Service Workers?

In previous versions of the Angular service worker implementation, one of the config options was "routing". This can be seen in this unanswered SO question, was referenced in this Angular CLI issue, and the best remaining documentation seems to be…
32
votes
5 answers

Can service workers cache POST requests?

I tried to cache a POST request in a service worker on fetch event. I used cache.put(event.request, response), but the returned promise was rejected with TypeError: Invalid request method POST.. When I tried to hit the same POST API,…
Aniket
  • 4,224
  • 8
  • 31
  • 49
31
votes
7 answers

Angular 5 and Service Worker: How to exclude a particular path from ngsw-config.json

I have ngsw-config.json (taken from the docs): { "index": "/index.html", "assetGroups": [{ "name": "app", "installMode": "prefetch", "resources": { "files": [ "/favicon.ico", …
ktretyak
  • 13,479
  • 8
  • 29
  • 52
31
votes
7 answers

Setting service worker to exclude certain urls only

I built an app using create react which by default includes a service worker. I want the app to be run anytime someone enters the given url except when they go to /blog/, which is serving a set of static content. I use react router in the app to…
user3577166
  • 362
  • 1
  • 3
  • 7