So zeigen Sie Ihre PWA neben nativen Apps in Freigabe-Benutzeroberflächen auf Systemebene an
Die API de destino de Web Share le permite mostrar su Progressive Web-App en el recurso compartido nativo de un Nutzername Bettdecke después de que se haya instalado. Si bien funciona muy bien si tiene un Server disponible para recibir la solicitud, es mucho más difícil ponerse a trabajar si no lo tiene.
In diesem Artikel werden wir verwenden
Arbeitsbox, un conjunto de bibliotecas de JavaScript para agregar soporte sin conexión a aplicaciones web, para crear una Ziel-URL compartida que se encuentre completamente dentro de su trabajador de servicio. Esto permite que los sitios estáticos y las aplicaciones de una sola página sirvan como destinos para compartir sin un punto final de dedizierter Server.
Gemeinsame Zielauswahl auf Systemebene mit einer installierten PWA mit dem Namen
Compartir Ziel Test als eine Option.
Auf derselben Seite
Wenn Sie mit der Funktionsweise von Web Share Target nicht vertraut sind, erhalten Sie eine ausführliche Einführung, indem Sie gemeinsam genutzte Daten mit der Web Share Target-API empfangen. Hier ist eine kurze Übersicht.
Hay dos partes para implementar la funcionalidad de destino del recurso compartido web. Primero, actualice el manifiesto de su aplicación web para indicar que desea que su aplicación Sein un destino compartido cuando se instale. El siguiente ejemplo dirige las acciones al / Compartir Url durch POST Anfrage. Es ist als mehrteiliges Formular codiert und der Titel heißt
Süßkartoffel, Text genannt Beschreibungund JPEG-Bilder werden aufgerufen Fotos.
…
"share_target": {
"action": "/share",
"method": "POST",
"enctype": "mehrteilige / Formulardaten",
"params": {
"title": "name",
"text": "description",
"files": [
{
"name": "photos",
"accept": ["image/jpeg", ".jpg"]
}
]
}
}
…Der Servicemitarbeiter teilt die Ziele mit der Workbox
Aunque normalmente lo maneja un punto final del servidor, un buen truco que puede hacer para un Ziel compartido es registrar una ruta directamente en su trabajador de servicio para manejar la solicitud. Esto permitirá que su aplicación sea un objetivo para compartir sin un backend.
Du machst das in Arbeitsbox Protokollieren einer von Ihrem Servicemitarbeiter gefahrenen Route. Beginnen Sie mit dem Importieren
registerRoute von 'Workbox-Routing'. Bitte beachten Sie, dass Sie bei registriert sind
/ Compartir route, dieselbe, die im Manifest für die Beispielwebanwendung angezeigt wird. Als Antwort rufen Sie an shareTargetHandler ().
importieren { registerRoute } desde 'Workbox-Routing';registerRoute(
'/share',
shareTargetHandler,
'POST'
);
das shareTargetHandler () La función es asincrónica y toma el Veranstaltung, espera los datos del formulario y luego recupera los archivos multimedia de eso.
asynchron Funktion shareTargetHandler ({Veranstaltung}) {
const formData = erwarten Veranstaltung.request.formData();
const mediaFiles = formData.getAll('media');zum (const mediaFile of mediaFiles) {
});
};
Luego puede hacer lo que quiera con estos archivos. Puede almacenarlos en Zwischenspeicher. Puede enviarlos a algún lugar con una solicitud de recuperación. Incluso puede usar las otras opciones de manifiesto, tal vez sirviendo una página con algunos parámetros de consulta para los otros elementos compartidos o almacenando los datos y punteros a los medios en el Caching-API
oder IndexedDB.
Sie können es in der Beispiel-App versuchen Fugus Tagebuch und zeigen Sie die Implementierung Ihres Servicemitarbeiters in Ihrem an Quellcode.
Sie können häufig gemeinsam genutzte Ressourcen behalten, bis bessere Netzwerkverbindungen verfügbar sind. Workbox unterstützt auch die regelmäßige Synchronisation im Hintergrund.
Fazit
La API Share Target es una forma sencilla de integrar profundamente su aplicación web progresiva en los dispositivos del usuario, poniéndolos a la par con las aplicaciones nativas para la tarea crítica de compartir Inhalt entre aplicaciones. Pero hacerlo normalmente requiere un servidor disponible para recibir la solicitud. Al aprovechar Workbox para crear una ruta de destino compartido directamente en su trabajador de servicio, su aplicación está libre de esta restricción, lo que permite que Share Target funcione para aplicaciones sin conexión y sin backends.
Foto von Elaine Casap im Unsplash
