Android Native App Install Banner Is Not Working

Question

I am trying to get a native app install banner for my Android app on my site. My manifest.json looks like this:

{
    "short_name": "App Name",
    "icons": [
        {
            "src": "launch-icon.png",
            "sizes": "144x144",
            "type": "image/png"
        }
    ],
    "prefer_related_applications": true,
    "related_applications": [
        {
            "platform": "play",
            "id": "my.app.id"
        }
    ]
}

It meets all the critiera list here:

• Served over HTTPS
• short_name
• 144x144 icon

I am skipping the engagement checks for testing by setting the chrome flag:

chrome://flags/#bypass-app-banner-engagement-checks

I have tried the example page and it works as expected, i.e. the banner shows. However I cannot see any difference between how my manifest is set up vs. the one in the example. I have used remote debugging to verify that the manifest file does get fetched.

Answer 1

It looks like you have most of the requirements met. There is one missing criteria: multiple different icon sizes are required. Those sizes are 36x36, 48x48, 72x72, 96x96, 144x144, 192x192.

Also, the start_url can be . to set the current path.

Here's an example:

{
  "name": "App Name",
  "short_name": "App Name Install Banner Sample",
  "icons": [
    {
      "src": "icon-0-75x.png",
      "sizes": "36x36",
      "type": "image/png"
    },
    {
      "src": "icon-1x.png",
      "sizes": "48x48",
      "type": "image/png"
    },
    {
      "src": "icon-1-5x.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "icon-2x.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "icon-3x.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "icon-4x.png",
      "sizes": "192x192",
      "type": "image/png"
    }
  ],
  "prefer_related_applications": true,
  "related_applications": [
    {
      "platform": "play",
      "id": "com.google.samples.apps.iosched",
      "url": "https://play.google.com/store/apps/details?id=com.google.samples.apps.iosched"
    }
  ],
  "start_url": ".",
  "display": "standalone"
}

As a reminder:

1. Enable this flag in chrome chrome://flags/#bypass-app-banner-engagement-checks
2. Login to Google Play on your Android device or emulator (make sure the emulator has the play store)
3. The app should not already be installed on the device
4. Follow the requirements listed at the top here
5. Inspect the sources tab in your browser to see if the manifest is served correctly and remember to check the console for any errors (warnings are fine)