Sdílet prostřednictvím

Integrace progresivních webových aplikací se službou Windows Share

Tento článek vysvětluje, jak integrovat progresivní webovou aplikaci (PWA) s funkcí Windows Share . Tato funkce umožňuje uživatelům sdílet obsah z jedné aplikace pro Windows do jiné. PWA se zaregistruje jako cíl sdílení pro příjem a zpracování sdílených souborů v aplikaci.

Co je Cíl sdílení?

Sdílecí cíl je funkce, která byla představena ve Windows 8 a umožňuje aplikaci přijímat data z jiné aplikace. Sdílený cíl funguje jako schránka pro kopírování, ale s dynamickým obsahem.

Sdílení obsahu z PWA

Pokud chcete sdílet obsah, aplikace PWA generuje obsah (například text, odkazy nebo soubory) a předává sdílený obsah operačnímu systému. Operační systém umožňuje uživateli rozhodnout, kterou aplikaci chce použít k přijetí daného obsahu. Aplikace PWA můžou použít Web Share API k aktivaci zobrazení sdílecího rozhraní ve Windows. Rozhraní API pro webové sdílení je podporováno v prohlížečích Microsoft Edge a dalších prohlížečích založených na chromiu.

Úplný příklad sdílení obsahu z PWA najdete v dokumentaci k Microsoft Edgi.

Příjem sdílených souborů v aplikaci PWA

Pro příjem obsahu funguje PWA jako cíl pro obsah. PWA musí být Registrován v operačním systému jako cílový bod pro sdílení obsahu.

Člen share_target musí obsahovat potřebné informace, aby systém mohl předat sdílený obsah vaší aplikaci. Představte si následující ukázkovou konfiguraci manifestu share_target :

"share_target": {
  "action": "./share_target_path/?custom_param=foo",
  "method": "POST",
  "enctype": "multipart/form-data",
  "params": {
    "files": [
      {
        "name": "mapped_files",
        "accept": ["image/jpeg"]
      }
    ]
  }
},

Když uživatel vybere aplikaci jako cíl sdíleného obsahu, spustí se PWA. Požadavek GET HTTP se provede na adresu URL určenou action vlastností. Sdílená data se předávají jako parametry dotazu title, text a url. Je podána následující žádost: /handle-shared-content/?title=shared title&text=shared text&url=shared url.

Následující příklad ukazuje, jak zaregistrovat pracovníka služby s omezenou oblastí.

navigator.serviceWorker.register('scoped-service-worker.js',
                { scope: "./share_target_path/" })

Pracovník služby zpracovává sdílená data podle potřeby a pak buď požadavek splní, nebo může požadavek přesměrovat zpět na vlastní cestu. Následující příklad ukazuje, jak přesměrovat požadavek zpět ven z přizpůsobené cesty:

self.addEventListener('fetch', (event) => {
    event.respondWith((async () => {
        // Read the shared data here, then
        // Redirect back out of the share_target_path to the actual site
        return Response.redirect(event.request.url.replace("share_target_path/", ""));
    })());
    return;
});

Další informace najdete v příkladu příjmu sdíleného obsahu v dokumentaci k Microsoft Edgi.

Důležité informace o výkonu

Pokud je obslužná rutina načítání přidána výhradně pro podporu sdílení, mohou nastat potenciální problémy s latencí, protože požadavky může přerušit služební pracovník. Chcete-li tento problém vyřešit, zvažte nastavení share_target jako pseudo podcestu a registraci služebního pracovníka, který je konkrétně vymezený na tuto cestu. Tento přístup umožňuje použít obslužnou rutinu načítání pro cílový objekt sdílení bez registrace stejné obslužné rutiny načítání pro jiná volání.

Ukázková aplikace PWA

Ukázková aplikace PWA logo printer na GitHubu demonstruje, jak integrovat PWA s Windows Share Sheet. Aplikace umožňuje uživatelům tisknout logo PWA na tiskárnu. Aplikace používá Windows Sdílecí nabídku ke sdílení loga s jinými aplikacemi.

Viz také

  • Last updated on