Questions tagged [progressive-web-apps]

A progressive web application provides an application-like user experience that is low friction and is built using modern web capabilities and hosted on the web and can become an application on the user's system over time.

Progressive web applications are mobile experiences that combine the best of the web and the best of applications. They’re useful to users from the very first visit as "regular" sites that live in a tab, no install required. But as the user progressively builds a relationship with them over time, they become more and more powerful; loading extremely quickly even on flaky networks, sending relevant push notifications, and even having an icon on the homescreen and loading as top-level, fullscreen experiences.

A progressive web application is built with progressive enhancement as the core tenant so that they work for as many users as possible irrespective of browser choice. When the user agent (such as Chrome, Opera, and Firefox) supports technologies like Service Worker, Web Push, and the Add to Homescreen banner, the applications can be enhanced to provide a first class native-like experience for the user.

Progressive web applications tend to be architected around the concept of an App Shell. The shell of the functionality is loaded in and displayed to the user (and potentially permanently cached offline) and the content is loaded in dynamically as the user navigates around the app.

More information about progressive web applications can be found in the following links:

Articles about how real-world progressive web applications have been built:

5456 questions
40
votes
2 answers

Can a progressive web app (PWA) run a background service on a mobile device to get data from hardware (accelerometer, gps...)?

I see we can check the capabilities of a mobile browser using https://whatwebcando.today/, but can the hardware APIs be queried when not running on foreground? I mean... With PWA am I able to build an app that gets hardware info while running in…
Rafael Oliveira
  • 2,823
  • 4
  • 33
  • 50
40
votes
8 answers

How to Remove Chrome Logo from PWA App Home Screen Link (Android O Preview)

I just updated to Android O Preview and installed a few PWAs. On the home screen a miniature Chrome logo is placed by the icon. This wasn't there before the OS update. Ideally, I would like the PWA to look like a regular app on the home screen…
KVNA
  • 847
  • 1
  • 11
  • 24
40
votes
3 answers

Can a progressive web app be registered as a share option in Android?

Total newbie question. Tl;dr - Can a progressive web app be registered as a share option in Android? In Android, we can “Share” things to other installed Android apps. For example, let’s say I have Chrome for Android and the Google+ app installed on…
fung
  • 638
  • 6
  • 13
40
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
  • 8,384
  • 6
  • 38
  • 54
39
votes
1 answer

Is it possible to track geolocation with a service worker while PWA is not open

Is it possible to read from local storage and track geolocation in PWAs with a service worker while app is not open on phone (in background) So far my research is pointing to no, and I am finding that the PWA needs to be open for location…
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…
38
votes
6 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,926
  • 12
  • 41
  • 54
37
votes
5 answers

Open PWA when clicking on push notification handled by service-worker ng7 + android

We've a PWA implemented on angular 7 and NodeJS as backend. Push notification are sent from backend with web-push and handled by the angular service worker service. The behavior that we hope to have in Android is when the user clicks on the…
37
votes
5 answers

iOS/iPadOS safari push api support

Does the iOS/iPadOS version of safari support push api standard with service worker?
Niccolò Fanton
  • 552
  • 1
  • 5
  • 19
37
votes
2 answers

Chrome disables buttons and input elements when offline

I am working on a progressive web app and it has a file input button to choose a file from the device storage. It works fine offline on chrome desktop version but the android version disables the button. I have no idea how to fix this. There are no…
37
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
  • 15,541
  • 4
  • 40
  • 70
37
votes
4 answers

Does service worker runs on background even if browser is closed?

I see push notification for Facebook web in chrome only when I open chrome. I know that this notification are sent through service worker. I am wondering whether this background sync goes on even though browser is closed or only on opening chrome…
37
votes
6 answers

How to get Add to Home Screen Pop up on Site Open in mobile browser

How to get this pop up in mobile browser "Add to home" will create icon of chrome on home screen of mobile with site link on mobile. Please suggest the solution.
Niral Bhavsar
  • 519
  • 1
  • 6
  • 13
35
votes
7 answers

Uninstalling PWA for development testing (windows)

I installed my PWA on windows through developer's console, and now can't uninstall it to test installing it. I've tried removing service worker from chrome, but it will just get reregistered after I open the PWA through windows (if server is on).…
janat08
  • 1,725
  • 2
  • 16
  • 27
35
votes
7 answers

Firefox: Service Worker: SecurityError: DOMException: The Operation is insecure

In app.js, I am checking the serviceWorker existence in navigator object and if available then registering the SW. if ('serviceWorker' in navigator) { navigator.serviceWorker.register('./service-worker.js', { scope: './' }) …