BeforeInstallPromptEvent

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Nicht standardisiert: Diese Funktion ist nicht standardisiert und befindet sich nicht auf dem Weg zur Standardisierung. Verwenden Sie sie nicht auf Produktionsseiten, die dem Web ausgesetzt sind: Sie funktioniert nicht für alle Benutzer. Es kann auch 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() Nicht standardisiert Experimentell

Erstellt ein neues BeforeInstallPromptEvent-Objekt.

Instanz-Eigenschaften

Erbt Eigenschaften von seinem Elternteil, Event.

BeforeInstallPromptEvent.platforms Schreibgeschützt Nicht standardisiert Experimentell

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 Schreibgeschützt Nicht standardisiert Experimentell

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() Nicht standardisiert Experimentell

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

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
BeforeInstallPromptEvent
ExperimentalNon-standard
BeforeInstallPromptEvent() constructor
ExperimentalNon-standard
platforms
ExperimentalNon-standard
prompt
ExperimentalNon-standard
userChoice
ExperimentalNon-standard

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Partial support
Partial support
No support
No support
Experimental. Expect behavior to change in the future.
Non-standard. Check cross-browser support before using.
Has more compatibility info.

Siehe auch