progressive-web-apps

问题 We are currently developing a PWA for a client of ours. Everything has been going well, but while testing on iPhone (iOS 12.2) we are having an issue with the tags that have sms:123-456-7890 in the href. You get the "Safari cannot open this page because of the sms: tag" (paraphrasing). If you are browsing the site via Safari (not in the PWA mode), the anchor tag works fine and your iMessage opens up with the number in it. But when you're in the PWA mode and click the link, you get a version

问题 Following is the code for the SW, all working fine. I was caching all the dynamic pages previously, but this was creating me some issues. Like page DOM changes after users interaction are not reflected next time page view. Always it shows original DOM. SO I have needed the only image caching dynamically. I have commented original code which was caching all content. self.addEventListener('activate', function(event) { console.log('[Service Worker] Activating Service Worker ....', event); /

问题 Following is the code for the SW, all working fine. I was caching all the dynamic pages previously, but this was creating me some issues. Like page DOM changes after users interaction are not reflected next time page view. Always it shows original DOM. SO I have needed the only image caching dynamically. I have commented original code which was caching all content. self.addEventListener('activate', function(event) { console.log('[Service Worker] Activating Service Worker ....', event); /

问题 Following is the code for the SW, all working fine. I was caching all the dynamic pages previously, but this was creating me some issues. Like page DOM changes after users interaction are not reflected next time page view. Always it shows original DOM. SO I have needed the only image caching dynamically. I have commented original code which was caching all content. self.addEventListener('activate', function(event) { console.log('[Service Worker] Activating Service Worker ....', event); /

问题 I have a PWA in Angular 8. I have added $ ng add @angular/pwa , and the PWA functionality seems to work, accept for this problem: when I push a new build to production, the app is not updated on people's browsers (tested on Chrome and mobile Safari). Instead, when a user opens their browser to go to the app, he/she will see the previous (non-updated) version of the app that was previously on their browser. They will only see the newer version if they refresh the page. No errors are shown. I

问题 I have a PWA in Angular 8. I have added $ ng add @angular/pwa , and the PWA functionality seems to work, accept for this problem: when I push a new build to production, the app is not updated on people's browsers (tested on Chrome and mobile Safari). Instead, when a user opens their browser to go to the app, he/she will see the previous (non-updated) version of the app that was previously on their browser. They will only see the newer version if they refresh the page. No errors are shown. I

问题 I have created a webapp that is exhibiting different behavior between an installed PWA and in normal mobile safari on iOS after an orientation change. When I flip my iPhone or iPad from portrait to landscape and back to portrait again, sometimes the portrait orientation will be zoomed in (and sometimes not). This only occurs in the installed progressive web app (PWA) and not when viewed in the normal mobile safari. Additionally, this behavior occurs only for an iOS PWA (both iPhone and iPad)

问题 I have created a webapp that is exhibiting different behavior between an installed PWA and in normal mobile safari on iOS after an orientation change. When I flip my iPhone or iPad from portrait to landscape and back to portrait again, sometimes the portrait orientation will be zoomed in (and sometimes not). This only occurs in the installed progressive web app (PWA) and not when viewed in the normal mobile safari. Additionally, this behavior occurs only for an iOS PWA (both iPhone and iPad)

问题 The Google documentation on web app manifests specifies that in order to make web app icons mask properly, an icon should be marked as "purpose": "any maskable" . This works well on Chrome on Android but the mask fails to mask as expected when using "Add to home screen" in Firefox Android (Android 10, Firefox Mobile 68.5.0). In my manifest, I'm providing icons of sizes 192x192 and 512x512; Firefox does indeed take one of the icons from the manifest; it's just not performing the desired

问题 The Google documentation on web app manifests specifies that in order to make web app icons mask properly, an icon should be marked as "purpose": "any maskable" . This works well on Chrome on Android but the mask fails to mask as expected when using "Add to home screen" in Firefox Android (Android 10, Firefox Mobile 68.5.0). In my manifest, I'm providing icons of sizes 192x192 and 512x512; Firefox does indeed take one of the icons from the manifest; it's just not performing the desired