Apply changes to Web App Manifest on an installed PWA - html

If I want to make changes to my Progressive Web App, e.g. a slight change on the app name, or update the logo, is it possible to force an update on all my users' installed apps?
I tried adding "?v=2" to the manifest URL,
<link rel="manifest" href="/manifest.json?v=2" />
And also forced an update on the service worker.
However, it doesn't seem to apply the new changes on the installed app.
I tried this on Google Chrome on Android.

Forcing the update explicitly is not possible as per the spec. However, there's an ongoing discussion about it.
Are you completely sure your manifest.json wasn't served from the browser's cache? Or that the browser was actually served with the new HTML that referenced the renamed manifest.json?
My understanding was that you should just change the name (based on the content's hash, for instance) and let the browser do it's job. The spec says this way the browser should always request the new version. Not sure if the update should kick in immediately or before the next visit. However, I could be wrong.

Related

Changes to PWA manifest not applying

I'm having trouble applying updates made to Progressive Web App manifest. Updating stuff works otherwise just fine, but if I change something from my manifest, like background_color, the launch screen color will not change. I have monitored my server to see that manifest.json is indeed fetched. Restarting phone doesn't apply the changes either, the only way seems to be to uninstall the PWA and add back to home screen.
On desktop, chrome developer tools show that the manifest is correctly fetched and the changes can be seen in the dev tools. Is this expected behavior? Is there a way to make changes to manifest apply after the PWA has already been installed?
This has been addressed in the official The Web App Manifest docs:
Note: If you update your manifest.json file in the future, those
changes won't be automatically picked up by the users unless they
re-add your app to their home screen.
So, this is indeed the expected behavior.

How can I trigger an update of the manifest.json file in an installed progressive web app on Android? [duplicate]

If I want to make changes to my Progressive Web App, e.g. a slight change on the app name, or update the logo, is it possible to force an update on all my users' installed apps?
I tried adding "?v=2" to the manifest URL,
<link rel="manifest" href="/manifest.json?v=2" />
And also forced an update on the service worker.
However, it doesn't seem to apply the new changes on the installed app.
I tried this on Google Chrome on Android.
Forcing the update explicitly is not possible as per the spec. However, there's an ongoing discussion about it.
Are you completely sure your manifest.json wasn't served from the browser's cache? Or that the browser was actually served with the new HTML that referenced the renamed manifest.json?
My understanding was that you should just change the name (based on the content's hash, for instance) and let the browser do it's job. The spec says this way the browser should always request the new version. Not sure if the update should kick in immediately or before the next visit. However, I could be wrong.

Chrome extension image assets not showing up (manifest version 2)

I've just been updating a chrome plugin to manifest version 2. I've had no issues with permissions relating to javascript but the plugin has some image assets packaged with it that are no longer showing up.
The two specific cases are in popup notifications when the user interacts with the plugin in certain ways and some small images the plugin inserts into certain pages. In both cases the images are packaged with the plugin. I'm having no issue with the plugin loading images from external resources. My object-src setting in the content_security_policy includes 'self'.
What am I missing? I can open the images if I navigate to them directly via "chrome-extension:///some_img.png" so they are definitely there. I've used the webkit inspector and finding the img that has been inserted, right clicking on the img src and opening in a new tab also shows the img so the urls being inserted are correct (which they should be, I'm using the chrome.extension.getURL function).
UPDATE:
Setting img-src in the content_security_policy also did nothing. I don't know if chrome even uses that particular option but it's in the W3C spec.
After digging through the changelog for the last few chrome versions, I came across a new (added in Chrome 18) manifest option web_accessible_resources. This needs to be added to your manifest with a value that's a list of strings. The strings are paths in you plugin's directory to resources (imgs etc...) that you want to be accessible within web pages (or importantly, chrome desktop notifications). Adding this parameter to my manifest gave permissions for the necessary images to be loaded.

How to use chrome extension methods in my asp.net page?

I have page where RSS icon is present. I want that when user clicks on RSS icon it will check in chrome browser that, whether that RSS reader chrome extension is installed or not
I am trying to achieve this by using chrome extension methods, mentioned here.
I tried something like this but it is not working:
var port = chrome.extension.connect("nlbjncdgjeocebhnmkbbbdekmmmcbfjd");
To use this API you need to be either an extension or a web application having the necessary permissions - normal web pages cannot access it. However, detecting whether an extension is installed in Chrome is still easy:
<script src="chrome-extension://nlbjncdgjeocebhnmkbbbdekmmmcbfjd/manifest.json"
onload="alert('installed')" onerror="alert('not installed')"></script>
This uses the fact that the extension's manifest.json file is located under a predictable URL and that web pages are allowed to load this URL. Of course, this isn't an officially documented approach but rather a loophole and a privacy issue. So be prepared for it to stop working in some future Chrome version. At the moment it works however.

How to turn off HTML5 Offline caching

I've been using HTML5 Offline caching on my website for a while and for some reasons I am considering turning it off. To my surprise it doesn't work.
This is how I've implemented HTML5 Offline caching.
In my index.html I give path to the manifest file
<html manifest="app.manifest">
In the app.manifest file I list all the js/css/png file that I would like to be cached by the browser for offline usage. Every time I deploy updates, I update the app.manifest file, which causes the browser to fetch latest version of all the files listed in the manifest file.
In order to turn off the offline caching, I changed my index.html's opening tag to
<html>
I made a dummy change to app.manifest file, so that browser (which has already cached my website), will detect the change and download latest version of all the files (including index.html).
What I noticed is, the browser indeed gets the latest version of all the files. I see the new <html> tag in the updated version without the manifest declaration, however the behavior of the browser for future changes does not change. i.e. I now expect the browser to immediately fetch the new version of the index.html file, when it's changed on server. However that doesn't happen. The browser doesn't download updated index.html until I make any changes to the manifest file.
Thus it appears to me that the browser has permanently associated app.manifest file with my website URL and it won't get rid of it even when I don't mention it in <html> tag.
I have tested this on both Google Chrome and Firefox, same results. I also tried restarting Chrome, but it won't forget that my site ever had app.manifest defined for it. I haven't found any discussion on this aspect of offline caching on the web.
Update: I managed to get rid of the behavior in Chrome by clearing all the browsing data (by going to settings). But that's not something I can tell the users to do.
Make the manifest URL return a 404 to indicate you don't want offline web applications anymore. According to Step 5 of HTML5 ยง5.6.4, this marks the cache as obsolete, and will remove it.
You can also manually delete the offline web application in Chrome by going to about:appcache-internals.