Installing applications

In order for an application to be installable, it needs to fulfill a few requirements:

  • It is served over HTTPS
  • It has a Web App Manifest
  • It has a ServiceWorker
  • A user has interacted with the page repeatedly

When these requirements are fulfilled, supporting browsers on mobile devices will allow users to install the application. For the best user experience, you should let the user initiate the install process.

Start by intercepting the beforeinstallprompt event.

let installPrompt;
window.addEventListener('beforeinstallprompt', event => {
// Don't show the install popup without the user asking for it
event.preventDefault();

// Save event for later
installPrompt = event;

// Show or enable install button in your app
});

With the event saved, you can hook it up to trigger the prompt:

document.querySelector('#install-button').addEventListener('click', async () => {
// Show prompt to user
installPrompt.prompt();

const installed = await installPrompt.userChoice;
console.log('User installed app: ' + installed);

// Clean up. Prompt cannot be reused.
installPrompt = null;
});