Start · Sprachen · JavaScript · Referenz · BeforeInstallPromptEvent.platforms

BeforeInstallPromptEvent.platforms

Eigenschaft

Nur lesbares Array von Zeichenketten mit den Plattformen, für die das <code>beforeinstallprompt</code>-Ereignis ausgelöst wurde, z. B. <code>["web"]</code>.

seit JavaScript Nicht standardisiert, experimentell: nur Chromium- Kategorie: webapi

Signatur

BeforeInstallPromptEvent.platforms

Beschreibung

Die Eigenschaft platforms des BeforeInstallPromptEvent liefert ein Array von Zeichenketten. Jeder Eintrag steht für eine Plattform, auf der die Anwendung installiert werden kann. In aktuellen Chromium-Browsern enthält das Array fast immer nur "web": Das bedeutet, dass die Progressive Web App (PWA) direkt aus dem Browser installiert werden kann.

Ursprünglich war die Eigenschaft für Fälle gedacht, in denen das Web-App-Manifest über related_applications auf native Apps verweist, etwa "play" für Google Play. Die Werte in platforms passen zu dem Wert, den userChoice später in seiner Eigenschaft platform meldet. Daran erkennt man, über welche Plattform der Nutzer installiert hat.

Wofür man sie in der Praxis nutzt:

  • für Analysen und Logging, also um zu erfassen, welche Installationswege angeboten wurden,
  • um vor dem Anzeigen eines eigenen Installations-Buttons zu prüfen, ob eine Web-Installation ("web") überhaupt möglich ist.

Die Eigenschaft ist nur lesbar. Man kann sie nur innerhalb des Handlers für beforeinstallprompt abfragen oder später an einem gespeicherten Ereignisobjekt.

Rückgabewert

Typ
string[]
Beschreibung
Ein Array von Plattform-Kennungen als Zeichenketten, z. B. ["web"] oder ältere Werte wie "play". Das Array kann nicht verändert werden.

Beispiele

Plattformen beim Installationsangebot protokollieren

window.addEventListener('beforeinstallprompt', (event) => {
  console.log('Installierbar auf:', event.platforms);
});
Installierbar auf: ["web"]

Eigenen Installations-Button nur bei Web-Installation anzeigen

let deferredPrompt = null;
const installButton = document.querySelector('#install');
installButton.hidden = true;

window.addEventListener('beforeinstallprompt', (event) => {
  // Standard-Infoleiste des Browsers unterdrücken
  event.preventDefault();

  if (event.platforms.includes('web')) {
    deferredPrompt = event;
    installButton.hidden = false;
  }
});

installButton.addEventListener('click', async () => {
  if (!deferredPrompt) return;
  deferredPrompt.prompt();
  const { outcome, platform } = await deferredPrompt.userChoice;
  console.log(`Ergebnis: ${outcome} (Plattform: ${platform})`);
  deferredPrompt = null;
  installButton.hidden = true;
});
Ergebnis: accepted (Plattform: web)

Funktion prüfen und Plattformen an die Analyse senden

const supportsInstallPrompt = 'onbeforeinstallprompt' in window;

if (supportsInstallPrompt) {
  window.addEventListener('beforeinstallprompt', (event) => {
    const platforms = Array.isArray(event.platforms) ? event.platforms : [];
    navigator.sendBeacon('/analytics/install-offer', JSON.stringify({ platforms }));
  });
} else {
  console.log('Kein beforeinstallprompt: Installationshinweise manuell anzeigen (z. B. iOS "Zum Home-Bildschirm").');
}

// Wichtig · Fallstricke

  • Nicht standardisiert: BeforeInstallPromptEvent und damit auch platforms gibt es nur in Chromium-Browsern. Firefox und Safari (auch unter iOS) lösen beforeinstallprompt nicht aus. Deshalb vorher mit 'onbeforeinstallprompt' in window prüfen, ob das Ereignis unterstützt wird, und für andere Browser eine Alternative anbieten.
  • In der Praxis steht fast immer nur ["web"] im Array. Leiten Sie aus dem Wert keine Informationen über das Betriebssystem ab. Dafür ist die Eigenschaft nicht gedacht.
  • Das Ereignis wird nur ausgelöst, wenn die Kriterien für die Installierbarkeit erfüllt sind (gültiges Manifest, HTTPS, je nach Version ein Service Worker) und die App noch nicht installiert ist.
  • prompt() kann nur einmal pro Ereignisobjekt aufgerufen werden. Außerdem ist eine Nutzergeste nötig, etwa ein Klick. Nach der Nutzung sollte man den Verweis auf das Ereignis verwerfen.
  • In TypeScript gehört der Typ nicht zu lib.dom.d.ts und muss selbst deklariert werden.