If you are using Chrome in Android or any of the desktop OS, that would be the default behavior. Check on “Android intent filter” in this link. This feature is not supported in iOS yet for PWA apps(created using Safari- the only option for iOS as of June-2018).See “What PWAs can do on Android and … Read more
Although Ian’s answer was great by the time it was posted (04.2015), this question became important point of entry for a lot people interested in service workers and Progressive Web Apps and answer is much broader now. Feedback from Apple 30.03.2018: Service workers are shipped with Safari 11.1. Good job! https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_11_1.html 20.12.2017: Service workers enabled … Read more
As already pointed out, it’s more of a “service workers” issue than a “vue cli” one. First of all, to make sure we’re on the same page, here’s what the boilerplate content of registerServiceWorker.js should look like (vue cli 3, official pwa plugin): import { register } from ‘register-service-worker’ if (process.env.NODE_ENV === ‘production’) { register(`${process.env.BASE_URL}service-worker.js`, … Read more
Perhaps, don’t show the button until you intercept the automatic pop-up? or In your code, check to see if the window is standalone If it is, you need not show the button if (window.matchMedia(‘(display-mode: standalone)’).matches) { // do things here // set a variable to be used when calling something // e.g. call Google Analytics … Read more
You will probably need to tell the service worker to check the server for updates, I usually use a service for this: export class UpdateService { constructor(public updates: SwUpdate) { if (updates.isEnabled) { interval(6 * 60 * 60).subscribe(() => updates.checkForUpdate() .then(() => console.log(‘checking for updates’))); } } public checkForUpdates(): void { this.updates.available.subscribe(event => this.promptUser()); } … Read more
There are no big difference rather than naming. Use whichever you prefer: href=”/manifest.webmanifest” or “/manifest.json”. Just don’t forget that MIME type has to be: application/manifest+json in both cases. <link rel=”manifest” href=”/manifest.webmanifest”> <link rel=”manifest” href=”/manifest.json”> Note that spec says it should be manifest.webmanifest. And later it may be important because it is under heavy development. For … Read more
Chrome(or any PWA supporting browser) triggers the beforeinstallprompt event for Web app install banner, which you can catch and re-trigger in more appropriate time when you think user wont miss it/convinced about adding your site to home page. Starting Chrome version 68, catching beforeinstallprompt and handling the install prompt programmatically is mandatory and no banners … Read more
While iOS 11.3 does support web app manifests, it does not yet support specifying icons this way. You’ll want to include it in your manifest for other devices, but at least for now you’ll have to use the following for iOS: <link rel=”apple-touch-icon” sizes=”180×180″ href=”https://stackoverflow.com/questions/49568333/icon.png”> Specify the icon size, and include a URL. Learn more … Read more
No. There is no such option in Chrome for iOS. I’m using iOS 12 on iPhone X with latest Chrome and I don’t see such option. Safari for iOS have “Add to home screen” for a long time now. Its just the “Service worker” support that came recently in 11.3 version . Notably, Chrome for … Read more
After looking at your gist and your question, I think your issue is with scoping. From what I’ve determined with service workers(at least with static files), the service worker only has a maximum scope of the directory it is in. That is to say, it can’t load files/requests/responses that are pulled from a location at … Read more