Progressive Web-Apps unter Windows

Progressive Web-Apps \ (PWAs ) bieten Zugriff auf Open Web-Technologien für die plattformübergreifende Interoperabilität und bieten ihren Benutzern eine systemeigene, App-ähnliche Benutzeroberfläche, die auf Ihre Geräte zugeschnitten ist. PWAs sind Websites, die schrittweise verbessert werden, um wie Native apps auf unterstützenden Plattformen zu funktionieren. Die Eigenschaften einer PWA vereinen das Beste aus Web- und nativen Apps.

Erkennbar

Aus Websuche-Ergebnissen und unterstützenden App-Stores

Installierbar

Anheften und starten über den Startbildschirm, Startmenü, Taskleiste usw.

Wieder einbinden

Senden von Push-Benachrichtigungen, auch wenn die APP nicht aktiv ist

Netzwerk unabhängig

Funktioniert offline und unter günstigen Netzwerkbedingungen

Progressive

Die Erfahrung skaliert nach oben (oder unten) mit Gerätefunktionen

Sicher

Bietet einen sicheren HTTPS-Endpunkt und andere Sicherheitsvorkehrungen für Benutzer

Dynamisch

Passt sich der Bildschirmgröße des Benutzers oder der Ausrichtung und Eingabemethode an.

Freigeben und starten von einem Standardhyperlink

 

Erstellen Sie Ihre vorhandene Website in eine PWA, um die Interaktion mit ihren Benutzern zu verbessern. Zu den Verbesserungen gehören Push-Benachrichtigungen, App-ähnliche Integration und Offlineunterstützung. Bauen Sie Ihre Zielgruppe im geöffneten Web weiter auf, damit die Benutzer ihre PWA-Suche und Link Freigabe entdecken können. Das beste daran ist, dass Ihre APP mit dem Webservercode aktualisiert wird.

PWAs auf Microsoft Edge (Chrom)

Wenn Sie eine progressive Web App für Webstandard-APIs erstellen, kann Ihre Anwendung plattformübergreifend und auf Geräten bereitgestellt werden und die gerätespezifischen Funktionen wie verfügbar nutzen. PWAs in Microsoft Edge \ (Chrom ) fügen Sie Ihrer Website die folgenden Vorteile hinzu.

  • Ihre APP ist auf einer auf Standards basierenden Web-Plattform aufgebaut.
  • Ermöglicht es Ihren Benutzern, Ihre APP direkt aus dem Browser zu installieren.
  • Ermöglicht es Ihren Benutzern, Ihre APP ohne Store-basierte Bereitstellung oder Registrierung zu installieren.

Desktop-PWAs werden auf allen Plattformen unterstützt, die Microsoft Edge \ (Chrom ) verfügbar ist. Microsoft Edge \ (Chrom ) steht unter Windows 7, Windows 10 und macOS zur Verfügung. Die folgenden Vorteile sind im Lieferumfang enthalten.

  • Anwendungen können über das Symbol " Installieren " in der Navigationsleiste direkt im Browser installiert werden.

    Installieren des Anwendungs Flyouts und-Symbols

  • Anwendungen können auch über das Menü Einstellungen- > apps installiert, ausgeführt und verwaltet werden.

    Installieren des Anwendungs Flyouts und-Symbols

  • Web-Benachrichtigungen sind in das Windows-Benachrichtigungssystem integriert.

  • Shared Cookie Store mit dem Browserprofil, das die APP installiert hat

  • Zugriff auf andere Browser Features über das Menü " Einstellungen" und "mehr \ ( ... )", einschließlich Zertifikatüberprüfung, Websiteberechtigungen, nach Verfolgungs Schutz und Browsererweiterungen

  • Vollzugriff auf Microsoft Edge devtools zum Debuggen Ihrer APP

Wichtig

Wenn Sie PWAs speziell für Windows 10 anpassen möchten, die WinRT-API-Anforderungen mithilfe von JavaScript erstellen, navigieren Sie zu der Dokumentation, die für die EdgeHTML PWA-Features spezifischist. Erfahren Sie mehr über das Testen ihrer PWA unter Windows 10 und deren Verteilung im Microsoft Store.

Hinweis

Weitere Informationen zu PWA-Vorteilen, bevorstehenden Features und kurzen Demos finden Sie unter Erstellen von 2020-PWA-Sitzungen.

Anforderungen

Damit Sie als PWA ausgeführt werden kann, sollte Ihre vom Server gehostete Web-App die folgenden Mindestanforderungen erfüllen:

Schützt Ihre Benutzer, indem eine sichere Verbindung für die Server-oder App-Kommunikation bereitgestellt wird. Dienstmitarbeiter und andere PWA-Technologien funktionieren nur mit Webressourcen, die über eine sichere Verbindung bereitgestellt werden \ (oder localhost zu Debugging-Zwecken ).

Verwendet Dienst Arbeitsthreads, um als Netzwerk Proxys zwischen Ihrem Server und der Client-App zu fungieren. Dienst Arbeitsthreads bieten Offlineunterstützung, Zwischenspeicherung von Ressourcen, Push-Benachrichtigungen, Synchronisierung von Hintergrunddaten und Optimierungen bei der Seiten Ladeleistung.

Stellt eine JSON-basierte Metadatendatei bereit, die wichtige Informationen zu Ihrer Web-App beschreibt, damit Windows 10 und andere Hostplattformen ihren PWA-Benutzern eine installierbare, systemeigene App-ähnliche Benutzeroberfläche bereitstellen. Zu den wichtigsten Informationen zählen Symbole, Sprache und URL-Einstiegspunkt.

Um eine tolle PWA zu sein, muss Ihre APP auch die folgenden Voraussetzungen erfüllen.

Stellen Sie sicher, dass Ihre PWA-Funktion in verschiedenen Browsern und Umgebungen getestet wird.

Verwendet flüssige Layouts und flexible Bilder. Das reaktionsfähige Design umfasst die folgenden Elemente, die ihre UX an das Gerät Ihres Benutzers anpassen.

Verwendet [Geräte Emulations Tools][DevToolsGuide|::ref1::|] aus dem Browser, um lokal zu testen oder eine Remote Debugsitzung zu erstellen, die direkt auf einem Zielgerät getestet wird.

Leitet jede Seite Ihrer Website an eine eindeutige URL weiter, damit vorhandene Benutzer Ihnen helfen können, ein noch größeres Publikum durch Social Media Sharing zu engagieren.

Verwendet Code Quality Tools wie webhint Linter, um die Effizienz, Robustheit, Sicherheit und Barrierefreiheit Ihrer APP zu optimieren.

Überprüft Ihre PWA mit der Google-Baseline PWA-Checkliste.

Hinweis

Wenn Sie Ihre PWA in eine Microsoft Store -Anwendung umwandeln möchten, navigieren Sie im Microsoft Store zu Progressive Web Apps (EdgeHTML).

Weitere Informationen