progressive-web-apps

问题 I'm adding PWA support to a web app. I want to add a back-button to the interface for iOS when the app is used as a PWA but not when used in the old fashioned way in Safari (or another browser). I know I can detect this via JS - so I could just show/hide the back-button at runtime, but I would like to know if there is any way to detect in on the server-side already ( apache/php ). I guess there will be more use-cases coming up to serve slightly different content. I guess I could set a cookie

问题 I have a Vue CLI 3 based app which I would like to function as a PWA. I need it to work in history mode, because the hash intervenes in redirects that I'm doing as part of an OAuth based authentication process. When the routing is in hash mode, the manages to load fine as PWA. Once I change the mode to 'history', the PWA I installed won't load anymore - I'm getting a white screen instead. I checked the browser version and it still works fine (I configured the fallback in my NGINX server to

问题 I have a Vue CLI 3 based app which I would like to function as a PWA. I need it to work in history mode, because the hash intervenes in redirects that I'm doing as part of an OAuth based authentication process. When the routing is in hash mode, the manages to load fine as PWA. Once I change the mode to 'history', the PWA I installed won't load anymore - I'm getting a white screen instead. I checked the browser version and it still works fine (I configured the fallback in my NGINX server to

问题 My PWA works as expected when I set the "display" of my manifest to "fullscreen" or "standalone". But, I want my users to be able to toggle back and forth in settings. Is there a way to switch this programmatically in JavaScript? 回答1: try this if you want to be sure that it will work in all browsers. function getFullScreen() { if (document.body.requestFullscreen) { document.body.requestFullscreen(); } else if (document.body.mozRequestFullScreen) { /* Firefox */ document.body

问题 My PWA works as expected when I set the "display" of my manifest to "fullscreen" or "standalone". But, I want my users to be able to toggle back and forth in settings. Is there a way to switch this programmatically in JavaScript? 回答1: try this if you want to be sure that it will work in all browsers. function getFullScreen() { if (document.body.requestFullscreen) { document.body.requestFullscreen(); } else if (document.body.mozRequestFullScreen) { /* Firefox */ document.body

问题 My PWA works as expected when I set the "display" of my manifest to "fullscreen" or "standalone". But, I want my users to be able to toggle back and forth in settings. Is there a way to switch this programmatically in JavaScript? 回答1: try this if you want to be sure that it will work in all browsers. function getFullScreen() { if (document.body.requestFullscreen) { document.body.requestFullscreen(); } else if (document.body.mozRequestFullScreen) { /* Firefox */ document.body

问题 on https://www.zamanha.com/sw.js on self.addEventListener('beforeinstallprompt', (e) => { the console.log() does not work. anyone? 回答1: the answer is in below. but it is very important to put it in the main.js that runs service worker like sw.js. after regissteration of service worker if ('serviceWorker' in navigator) { navigator.serviceWorker.register('/sw.js') } else { console.log('CLIENT: service worker is not supported.'); } this code -----> var deferredPrompt; self.addEventListener(

问题 I have a PWA app and when I do an Audit using the Chrome development tools, I get this message saying the CSS color code is invalid: Failures: The theme-color meta tag did not contain a valid CSS color. I beg to differ. It's a valid CSS color code. Also the Google dev page says: Lighthouse does not test whether the values are valid CSS color values. but that's contrary to what the audit complains about. I searched for this message and there's very little, or should I say, next to nothing,

问题 I want to build a PWA based on flutter web which relies on scanning a QR-Code and accessing the user's current position. From my point of knowledge for both functionalities there are currently no packages available. However for getting the user's location there is a stackoverflow thread (Get User's Location for flutter Web) providing a solution. So I'm wondering if there is any chance that there is a similar solution for the QR-Scanning issue? Sadly, I'm not very familiar with web and

问题 My site has several subsections. When a user adds the site to their homescreen, I'd like to make sure that the home screen icon launches them into the subsection they were on when they added to homescreen. I can register a different manifest for each subsection, but this doesn't work for single page apps where there's no page reload. I'm considering storing the subsection in a cookie and then redirecting from a generic start URL based on that cookie. Is there a better way to do this? 回答1: If