progressive-web-apps

问题 I'm getting the error Site cannot be installed: icon downloaded from the manifest was empty or corrupted I'm not able to find what is the problem. Below is my manifest.json . I'm using Angular 4 Progressive web app with material design. Manifest.json { "dir": "ltr", "lang": "en", "name": "Hello", "scope": "/", "display": "standalone", "start_url": "./?utm_source=web_app_manifest", "short_name": "Hello", "theme_color": "#f27b00", "description": "", "orientation": "any", "background_color": "

问题 According to workbox doc, cross domain request should be configured to ensure that regular expression matches the beginning of the URL. However, it doesn't work. The service worker code is like below. importScripts('https://storage.googleapis.com/workbox-cdn/releases/3.0.0/workbox-sw.js'); workbox.routing.registerRoute( /.*\.(png|jpg|jpeg|svg|gif)/, workbox.strategies.cacheFirst() ); workbox.routing.registerRoute( new RegExp('^https://a248.e.akamai.net/.*'), workbox.strategies.cacheFirst() );

问题 I followed this article to make a TWA from a PWA. Everything is fine and the app feels like the PWA, but what I can't achieve is to lock the orientation to landscape. The manifest of the PWA has this: "orientation": "landscape", "display" : "standalone" So if you add it to the homescreen from Google chorme it works as intended. I tried setting the android:screenOrientation="landscape" in the manifest file and like this starts the app on landscape but it doesn't lock it. Anyone has tried

问题 In these demos, there are logos on the splash screens. https://addyosmani.com/blog/getting-started-with-progressive-web-apps/ I don't know what I am doing wrong in my manifest - I have an icon but it is not showing up on my splash screen. My manifest looks like this: { "short_name": "Weather Service", "name": "Weather Service", "icons": [ { "src": "logo.png", "sizes": "144x144", "type": "image/png" } ], "start_url": "index.html", "display": "standalone", "orientation": "portrait", "background

问题 I have a mobile web app with the Add to Home Screen functionality working well. I am trying to determine how to use Google Analytics to best track the app usage for those who have installed the app to their home screen. There doesn't seem to be a default way to see if an app is in standalone mode in analytics, is there a best practice for Google Analytics to track apps installed on the home screen? 回答1: You can detect if the app is launched in PWA mode. Refer this answer on how to do it. Once

问题 Iam trying to implement networkfirst strategy using sw-precache . Now iam able to cache the data and able to serve from offline . If i change the data (i.e: changed the header from 'hello' to 'Welcome') in page not get reflecting it always taking the data from the cache its getting update only if i unregistered the service worker or clear the site data then only i can get my data Here is my sw-precache gulp task : gulp.task('generate-service-worker', function(callback) { var path = require(

问题 While developing a Progressive-Web-App the following Problem occurred: Standalone mode works perfectly without including the service worker - but does NOT work with. Without Service-Worker a2hs (added to Homescreen) PWA gets correctly started in "standalone" -Mode. After adding the Service-Worker (a2hs + installed / Web-APK) PWA opens new Tab in new Chrome-Window. Chrome-PWA-Audit: login_mobile_tablet.jsf / include service worker: <script> if ('serviceWorker' in navigator) { navigator

问题 We are developing progressive web app, in android phone, we are seeing url in address s shown in below, enter image description here Steps we have taken care in Manifest.json, "display": "standalone", "orientation": "portrait", "Scope": "/", "start_url": "/Home/Test", Starting page always which is http://localhost:52432/Home/test , displaying perfectly in stand alone, but when we click other tabs then it started displaying url in the address bar with lock symbol. Can any body help me on this,

问题 I’m building a new web application which needs to work seamlessly even when there is no internet connection. I’ve selected Angular and am building a PWA as it comes with built-in functionality to make the application work offline. So far, I have the service worker working perfectly and driven by the manifest file, this very nicely caches the static content and I’ve set it to cache a bunch of API requests which I want to use whilst the application is offline. In addition to this, I’ve used

问题 Neither one of the methods used to detect standalone mode in Chrome Android work in my PWA This is the CSS method I tried @media all and (display-mode: standalone) { /* Here goes the CSS rules that will only apply if app is running standalone */ } And this is the Javascript method (line 171-175, 297-306) function isRunningStandalone() { return (window.matchMedia('(display-mode: standalone)').matches); } ... if (isRunningStandalone()) { /* This code will be executed if app is running