standalone display not working, https required?
MDN URL
https://developer.mozilla.org/en-US/docs/Web/Manifest/display
What specific section or headline is this issue about?
No response
What information was incorrect, unhelpful, or incomplete?
The standalone option is ignored in Chrome and Brave on Android. I've seen it work with other production PWAs of mine, but not for my local development app. That runs on my desktop PC on http and https but non-standard ports. I access it through my hostname and port from the mobile browsers.
What did you expect to see?
I've read in a web comment that it needs to be port 443. Is there an important information missing in this documentation? Is https and port 443 required to make it work? How should I test this locally? Or even use it, when my application runs purely on my private local network?
Do you have any supporting links, references, or citations?
No response
Do you have anything more you want to share?
No response
MDN metadata
Page report details
- Folder:
en-us/web/manifest/display - MDN URL: https://developer.mozilla.org/en-US/docs/Web/Manifest/display
- GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/manifest/display/index.md
- Last commit: https://github.com/mdn/content/commit/942bbbe848b4b742a689de970f697d4c5b355bde
- Document last modified: 2024-07-26T15:54:52.000Z
Update: Port 443 also doesn't fix it, but I cannot try with a fully valid certificate because it's a local network and no trusted CA will give me certificates for that. Please describe all preconditions to make the standalone mode work. As it is published now, the information is wrong. Unfortunately I don't know the browser internals so I can't suggest a correction of the content.
@dipikabh FYI
Hi @ygoe, based on the manifest spec alone, there is no requirement for the standalone display mode to work on a specific port. It is very likely though for browsers to vary implementations and to have additional requirements beyond the spec in the case of web app manifest.
How should I test this locally? Or even use it, when my application runs purely on my private local network? I cannot try with a fully valid certificate because it's a local network and no trusted CA will give me certificates for that.
For your local development, are you already using a self-signed certificate to test with HTTPS? See https://web.dev/articles/how-to-use-local-https. Also check out https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Tutorials/CycleTracker/Secure_connection.
Please describe all preconditions to make the standalone mode work. As it is published now, the information is wrong.
I wouldn't deem the existing content on the page as incorrect - the page accurately describes standalone mode. Regarding the page potentially missing some content, it appears that the issue you are facing are related to your local development and testing configuration or specific browser implementation.
Given that you're experiencing the issue specifically with Chrome and Brave on Android, you might also want to file an issue/seek clarification with the Chromium project about requirements for testing the standalone mode, if any.
So I could successfully install the PWA with these measures:
- Set up a public DNS name that points to a local network address (A record) as a subdomain to an existing domain with SSL already set up
- Set up the browser (Brave/Android) to use a public DNS server (my local DSL router (AVM Fritzbox) cannot resolve such DNS records at all)
- Download the current SSL certificate for the domain above the new DNS name (in my case a wildcard cert from LetsEncrypt)
- Start the web server on a non-443 port using the public SSL cert
- Open the created DNS name and app port to access the app in the local network (or VPN from outside)
I can live with these requirements. I'll have to get the Fritzbox DNS bug fixed by the router maker.
So in the end, port 443 is not required, but a valid SSL certificate is. Self-signed or numeric IP URL won't do.