BeforeInstallPromptEvent

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig, bevor Sie diese produktiv verwenden.

Kein Standard: Diese Funktion ist nicht standardisiert und befindet sich nicht im Standardisierungsprozess. Verwenden Sie sie nicht auf Produktionsseiten, die auf das Web ausgerichtet sind: Sie wird nicht für alle Benutzer funktionieren. Außerdem kann es große Inkompatibilitäten zwischen Implementierungen geben und das Verhalten kann sich in Zukunft ändern.

Das BeforeInstallPromptEvent ist das Interface des beforeinstallprompt-Ereignisses, das am Window-Objekt ausgelöst wird, bevor ein Benutzer dazu aufgefordert wird, eine Webseite auf dem Startbildschirm eines Mobilgeräts zu "installieren".

Dieses Interface erbt vom Event-Interface.

Event BeforeInstallPromptEvent

Konstruktor

BeforeInstallPromptEvent()

Erstellt ein neues BeforeInstallPromptEvent-Objekt.

Instanz-Eigenschaften

Erbt Eigenschaften von seinem Elternteil, Event.

BeforeInstallPromptEvent.platforms Nur lesbar

Gibt ein Array von Zeichenketten zurück, das die Plattformen enthält, auf denen das Ereignis ausgelöst wurde. Dies wird für User Agents bereitgestellt, die dem Benutzer eine Auswahl von Versionen präsentieren möchten, wie beispielsweise "web" oder "play", wodurch der Benutzer zwischen einer Web-Version oder einer Android-Version wählen kann.

BeforeInstallPromptEvent.userChoice Nur lesbar

Gibt ein Promise zurück, das sich zu einem Objekt auflöst, das die Wahl des Benutzers beschreibt, als er zur Installation der App aufgefordert wurde.

Instanz-Methoden

BeforeInstallPromptEvent.prompt()

Zeigt eine Aufforderung, die den Benutzer fragt, ob er die App installieren möchte. Diese Methode gibt ein Promise zurück, das sich zu einem Objekt auflöst, das die Wahl des Benutzers beschreibt, als er zur Installation der App aufgefordert wurde.

Beispiele

Im folgenden Beispiel bietet eine App ihre eigene Installationsschaltfläche an, die eine id von "install" hat. Zunächst ist die Schaltfläche ausgeblendet.

html
<button id="install" hidden>Install</button>

Der beforeinstallprompt-Handler:

  • Bricht das Ereignis ab, was verhindert, dass der Browser seine eigene Installations-Benutzeroberfläche auf einigen Plattformen anzeigt
  • Weist das BeforeInstallPromptEvent-Objekt einer Variablen zu, damit es später verwendet werden kann
  • Zeigt die Installationsschaltfläche der App an.
js
let installPrompt = null;
const installButton = document.querySelector("#install");

window.addEventListener("beforeinstallprompt", (event) => {
  event.preventDefault();
  installPrompt = event;
  installButton.removeAttribute("hidden");
});

Beim Klicken auf die Installationsschaltfläche der App:

  • Ruft die prompt()-Methode des gespeicherten Ereignis-Objekts auf, um den Installationsdialog auszulösen.
  • Setzt seinen Zustand zurück, indem es die installPrompt-Variable löscht und sich selbst wieder ausblendet.
js
installButton.addEventListener("click", async () => {
  if (!installPrompt) {
    return;
  }
  const result = await installPrompt.prompt();
  console.log(`Install prompt was: ${result.outcome}`);
  installPrompt = null;
  installButton.setAttribute("hidden", "");
});

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch