Attiva obiettivo condivisione web nell'attività web attendibile

Web Share Target consente alle PWA di ricevere contenuti condivisi da altre applicazioni installate su dispositivo. Questa funzionalità può essere utilizzata, ad esempio, da applicazioni come gli editor di immagini per ricevere un'immagine da un'app fotocamera o da un social network per ricevere un'immagine o un video da condividere.

A partire da Chrome 86, Web Share Target è ora disponibile anche per le applicazioni che utilizzano Trusted Web Activity. Sebbene la PWA debba funzionare immediatamente, sono necessarie alcune modifiche all'applicazione Android.

Questo articolo presuppone che lo sviluppatore abbia familiarità con Trusted Web Activity. I lettori che non conoscono la tecnologia possono iniziare con la Guida all'integrazione.

Allo stesso modo, una spiegazione completa dell'implementazione di Web Share Target in una PWA non rientra nell'ambito di questo articolo. Gli sviluppatori possono trovare ulteriori informazioni in questo articolo.

L'applicazione demo all'indirzione https://scrapbook-pwa.web.app/ verrà utilizzata come PWA per questo articolo. Il relativo codice sorgente è disponibile su GitHub e l'applicazione Android si basa su la demo di base di Trusted Web Activity.

Aggiungere Web Share Target all'app Android

Per modificare un'applicazione basata su Trusted Web Activity esistente in modo da implementare Web Share Target, sono necessarie modifiche a tre file diversi:

build.gradle

La libreria android-browser-helper è stata aggiornata con il supporto di Web Share Target. Come primo passo, aggiorna l'applicazione in modo che utilizzi una versione uguale o superiore alla 2.0.1.

dependencies {
    ...
    implementation 'com.google.androidbrowserhelper:androidbrowserhelper:2.2.0'
}

res/strings.xml

L'applicazione deve comunicare a Trusted Web Activity i dettagli della condivisione che supporta la ricezione, ad esempio gli URL da aprire, il metodo da utilizzare e i tipi MIME supportati.

Questa operazione viene eseguita tramite un JSON, reso disponibile a Trusted Web Activity con una risorsa stringa. I campi sono gli stessi del campo share_target disponibile nel manifest web e possono essere aggiunti a una stringa all'interno di strings.xml, quasi così com'è, con due note importanti:

  1. Il valore dell'attributo action deve essere l'URL completo, inclusa l'origine.
  2. I doppi apici devono essere interpretati letteralmente, quindi ogni " diventa \".

Ecco come appare la sezione share_target di https://googlechrome.github.io/samples/scrapbook-pwa/manifest.json looks like:

{
  ...
  "share_target": {
    "action": "/_share-target",
    "enctype": "multipart/form-data",
    "method": "POST",
    "params": {
      "files": [{
        "name": "media",
        "accept": [
          "audio/*",
          "image/*",
          "video/*"
        ]
      }]
    }
  },
  ...
}

Il nuovo elemento stringa avrà il seguente aspetto:

<string name="share_target">
{
    \"action\": \"https://twa-web-scrapbook.web.app/_share-target\",
    \"method\": \"POST\",
    \"enctype\": \"multipart/form-data\",
    \"params\": {
      \"files\": [{
          \"name\": \"media\",
          \"accept\": [\"image/*\", \"audio/*\", \"video/*\"]
      }]
    }
}
</string>

AndroidManifest.xml

Sono necessarie alcune modifiche al manifest Android. Innanzitutto, dobbiamo assicurarci che DelegationService sia dichiarato, esportato e abilitato.

Gli sviluppatori che hanno creato la propria applicazione in base alla demo di base avranno già incluso il servizio e il markup dovrebbe trovarsi all'interno del tag dell'applicazione e avere il seguente aspetto:

<service
    android:name="com.google.androidbrowserhelper.trusted.DelegationService"
    android:enabled="true"
    android:exported="true">

    <intent-filter>
        <action android:name="android.support.customtabs.trusted.TRUSTED_WEB_ACTIVITY_SERVICE"/>
        <category android:name="android.intent.category.DEFAULT"/>
    </intent-filter>
</service>

Infine, è necessario aggiungere due nuovi elementi al tag dell'attività LauncherActivity: - Un tag meta-data che fa riferimento al JSON definito in strings.xml. - Un intent-filter che dichiara i tipi MIME che l'applicazione è in grado di gestire per altre app sul dispositivo.

<meta-data
    android:name="android.support.customtabs.trusted.METADATA_SHARE_TARGET"
    android:resource="@string/share_target"/>

<intent-filter>
    <action android:name="android.intent.action.SEND" />
    <action android:name="android.intent.action.SEND_MULTIPLE" />
    <category android:name="android.intent.category.DEFAULT" />
    <data android:mimeType="audio/*" />
    <data android:mimeType="image/*" />
    <data android:mimeType="video/*" />
</intent-filter>

Come si può notare nel markup sopra, è necessario aggiungere un elemento data per ogni mime-type dichiarato nel JSON share_target.

Conclusione

L'integrazione di Web Share Target consente alle PWA all'interno di Trusted Web Activity di essere integrate più profondamente con altre applicazioni installate su un dispositivo Android.

Come descritto nei passaggi precedenti, il markup aggiuntivo necessario per aggiungere il supporto dell'API in un'app Android esistente che utilizza Trusted Web Activity è semplificato da android-browser-helper.

Consulta l'articolo su Web Share Target per scoprire di più sull'utilizzo dell'API in una PWA e l' API Web Share per scoprire come condividere contenuti dalla Progressive Web App.

Risoluzione dei problemi

La mia applicazione non viene visualizzata come opzione quando provo a condividere un file da un'altra applicazione.

Se l'applicazione non viene visualizzata come opzione, significa che intent-filter non è corretto. Controlla il markup intent-filter e assicurati che contenga le azioni, categoria e mime-types gestiti dall'applicazione.

La mia applicazione viene visualizzata come opzione, la PWA viene avviata, ma i dati non vengono condivisi.

Esistono alcuni motivi per cui questo può accadere. Di seguito è riportato un elenco di controllo degli aspetti da esaminare:

  • Assicurati che la convalida di Digital Asset Links sia riuscita.
  • Controlla la correttezza del JSON all'interno di strings.xml.