Show PWA Install Banner on Device

Ionic Framework ionic-v3
1

I created a PWA using the CLI and enabled the service-worker code. When I run ionic serve to host it locally in Chrome, all looks good. I enabled the #bypass-app-banner-engagement-check and #enable-add-to-shelf flags - so I can see the app install banner as I would expect.

However, when I deploy my www files to a server (tornado, if that’s important), I can still access the app, but it doesn’t have the install banner.
I thought maybe the problem was that I wasn’t using HTTPS, so I modified my server to use HTTPS (using a self-signed cert). Now, when I run, the app loads but I get a “not secure” label in the address box, and Chrome Debug tools tell me “Site cannot be installed: the page is not served from a secure origin”. And, of course, still no app install banner.

From what I’ve read, Chrome doesn’t much like self-signed certificates, so will complain in this way.

I want to know

  1. Am I on the right track by assuming that the app install banner won’t show unless you use HTTPS ?
  2. If the above is correct, how can I test/demo my app on a real device without using a ‘real’ certificate?

Thanks for any help!

2

  1. Yep, you’ll need a signed cert from a certificate authority. Most browser aren’t fans of self-signed certs these days so you’ll need one from a legit authority. There is also Let’s Encrypt which offers frees, trusted certs.

  2. Same as one, check out Let’s Encrypt

1 Like