Attiva obiettivo condivisione web nell'attività web attendibile

Destinazione condivisione web consente alle PWA di ricevere contenuti condivisi da altre applicazioni installate su del dispositivo. Questa funzione può essere utilizzata, ad esempio, da applicazioni come gli editor di immagini per Ricevere un'immagine da un'app della 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 Attività web attendibile. Anche se la PWA dovrebbe funzionare da subito, sono necessarie alcune modifiche per l'Applicazione per Android.

Questo articolo presuppone che lo sviluppatore abbia familiarità con le Attività web attendibili. I lettori che non hanno mai utilizzato la tecnologia può iniziare con la Guida all'integrazione.

Analogamente, una spiegazione completa dell'implementazione del target della condivisione web in una PWA è al di fuori e gli sviluppatori possono trovare maggiori informazioni in questo articolo.

L'applicazione demo all'indirizzo https://scrapbook-pwa.web.app/ verrà utilizzata come PWA per questo evento e il relativo codice sorgente sia disponibile su GitHub, mentre l'Applicazione per Android si basa su la demo di base dell'Attività web attendibile.

Aggiungi Web Share Target all'app per Android

Per modificare un'applicazione basata su attività web attendibile esistente per implementare la condivisione web Destinazione, sono necessarie le modifiche a tre diversi file:

build.gradle

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

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

res/strings.xml

L'applicazione deve comunicare all'attività web attendibile i dettagli della condivisione che supporta ricezione, ad esempio quali URL aprire, il metodo da utilizzare e i tipi MIME supportati.

Ciò viene fatto tramite un file JSON, reso disponibile all'attività web attendibile con una risorsa di stringa. La corrispondono al campo share_target disponibile nel file manifest web e possono essere aggiunti una stringa all'interno di strings.xml, quasi com'è, con due note importanti:

  1. Il valore dell'attributo dell'azione deve essere l'URL completo, inclusa l'origine.
  2. Le virgolette doppie devono essere precedute dal carattere di escape, quindi ogni " diventa \".

Ecco come appare la sezione share_target di https://scrapbook-pwa.web.app/manifest.json come:

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

Il nuovo elemento stringa sarà simile al seguente:

<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 file manifest Android. Innanzitutto dobbiamo assicurarci che DelegationService è stato dichiarato, esportato e attivato.

Gli sviluppatori che hanno creato la propria applicazione sulla base della demo di base avranno già il servizio incluso e il markup deve essere all'interno del tag dell'applicazione ed essere simile al seguente:

<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, devi aggiungere due nuovi elementi al tag attività LauncherActivity: - Un tag meta-data che fa riferimento al file JSON definito nel file extensions.xml. - Un elemento intent-filter che dichiara i tipi MIME che l'applicazione è in grado di gestire ad altri le app installate 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ò vedere nel markup precedente, è necessario aggiungere un elemento data per ogni mime-type dichiarato nel file JSON share_target.

Conclusione

L'integrazione del target della condivisione web consente alle PWA all'interno di un'attività web attendibile di essere più approfonditi integrate con altre applicazioni installate su un dispositivo Android.

Come descritto nei passaggi precedenti, il markup aggiuntivo necessario per aggiungere il supporto per l’API in un l'app per Android esistente che utilizza l'Attività web attendibile è stata semplificata da android-browser-helper.

Consulta l'articolo sul target della condivisione web per scoprire di più sull'utilizzo dell'API su una PWA e sul API Web Share per scoprire come condividere contenuti dall'app web progressiva.

Risoluzione dei problemi

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

Quando l'applicazione non viene visualizzata tra le opzioni, significa che intent-filter è risposta errata. Ricontrolla il markup intent-filter e assicurati che contenga le azioni corrette. e mime-types gestiti dall'applicazione.

La mia applicazione mostra come opzione la PWA, ma i dati non vengono condivisi.

Le cause possono essere diverse. Ecco un elenco di controllo degli aspetti da tenere presenti:

  • Assicurati che la convalida di Digital Asset Links abbia esito positivo.
  • Controlla se il file JSON all'interno di logs.xml è corretto.