Vertrouwde webactiviteiten van meerdere oorsprong

Vertrouwde webactiviteiten zijn een nieuwe manier om de inhoud van uw web-app, zoals uw PWA, te integreren met uw Android-app met behulp van een protocol op basis van aangepaste tabbladen.

ff-origin navigatie

Voor een vertrouwde webactiviteit moeten de geopende oorsprongen worden gevalideerd met behulp van koppelingen naar digitale activa , zodat de inhoud op volledig scherm kan worden weergegeven.

Wanneer een gebruiker de gevalideerde oorsprong verlaat, wordt de gebruikersinterface van het aangepaste tabblad weergegeven. De URL-balk op het aangepaste tabblad laat de gebruiker weten dat hij of zij zich nu in een domein buiten de applicatie bevindt, terwijl de gebruiker ook een X-knop krijgt waarmee hij of zij snel naar de gevalideerde oorsprong kan terugkeren.

Het komt echter ook vaak voor dat web-apps ervaringen creëren die meerdere oorsprongen beslaan. Een voorbeeld hiervan is een winkelapplicatie waarbij de hoofdervaring zich op www.example.com bevindt, terwijl de afrekenstroom wordt gehost op checkout.example.com .

In dergelijke gevallen is het niet wenselijk om de aangepaste tabbladen weer te geven, niet alleen omdat de gebruiker zich in dezelfde applicatie bevindt, maar ook omdat de bovenste balk de indruk zou kunnen wekken dat de gebruiker de applicatie heeft verlaten en het afrekenen zou kunnen afbreken.

Met vertrouwde webactiviteiten kunnen ontwikkelaars meerdere bronnen valideren, en de gebruiker blijft in volledig scherm tijdens het navigeren tussen deze bronnen. Net als bij het hoofddomein moet de ontwikkelaar elke gevalideerde bron kunnen beheren.

Validatie instellen voor meerdere oorsprongen

Net als bij de hoofdoorsprong wordt de validatie bereikt via Digital Asset Links en moet elk te valideren domein een eigen assetlinks.json-bestand hebben.

In ons voorbeeld met www.example.com en checkout.example.com zouden we het volgende krijgen:

  • https://www.example.com/.well-known/assetlinks.json
  • https://checkout.example.com/.well-known/assetlinks.json

Omdat elk domein aan dezelfde Android-applicatie wordt gekoppeld, zien de assetlinks.json -bestanden er precies hetzelfde uit.

Ervan uitgaande dat de pakketnaam voor de Android-applicatie com.example.twa is, zouden beide assetlink.json -bestanden ongeveer het volgende bevatten:

[{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target": {
  "namespace": "android_app",
  "package_name": "com.example",
   "sha256_cert_fingerprints": ["..."]}
}]

Voeg meerdere oorsprongen toe aan de Android-applicatie

In de Android-applicatie moet de asset_statements -declaratie worden bijgewerkt zodat deze alle oorsprongen bevat die gevalideerd moeten worden:

<string name="asset_statements">
[{
    \"relation\": [\"delegate_permission/common.handle_all_urls\"],
    \"target\": {
        \"namespace\": \"web\",
        \"site\": \"https://www.example.com\"
    }
}],
[{
    \"relation\": [\"delegate_permission/common.handle_all_urls\"],
    \"target\": {
        \"namespace\": \"web\",
        \"site\": \"https://checkout.example.com\"
    }
}],
</string>

Voeg extra oorsprongen toe aan de LauncherActivity

De standaard LauncherActivity gebruiken

De LauncherActivity , die deel uitmaakt van de android-browser-helper ondersteuningsbibliotheek, biedt een manier om meerdere oorsprongen toe te voegen die gevalideerd moeten worden door het Android-project te configureren.

Voeg eerst een string-array element toe aan het bestand res/values/strings.xml . Elke extra URL die gevalideerd moet worden, bevindt zich in een item -subelement:

...
<string-array name="additional_trusted_origins">
    <item>https://www.google.com</item>
</string-array>
...

Voeg vervolgens een nieuwe meta-data toe binnen het bestaande activiteitselement die verwijst naar LauncherActivity in AndroidManifest.xml :

...
<activity android:name="com.google.androidbrowserhelper.trusted.LauncherActivity"
    android:label="@string/app_name">


    <meta-data
        android:name="android.support.customtabs.trusted.ADDITIONAL_TRUSTED_ORIGINS"
        android:resource="@array/additional_trusted_origins" />


    ...
</activity>
...

Een aangepaste LauncherActivity gebruiken

Bij het gebruik van aangepaste code om een ​​vertrouwde webactiviteit te starten, kunnen extra oorsprongen worden toegevoegd door setAdditionalTrustedOrigins aan te roepen tijdens het bouwen van de intentie om de vertrouwde webactiviteit te starten:

public void launcherWithMultipleOrigins(View view) {
  List<String> origins = Arrays.asList(
      "https://checkout.example.com/"
  );


  TrustedWebActivityIntentBuilder builder = new TrustedWebActivityIntentBuilder(LAUNCH_URI)
      .setAdditionalTrustedOrigins(origins);


  new TwaLauncher(this).launch(builder, null, null);
}

Conclusie

Met deze stappen is de vertrouwde webactiviteit nu klaar om meerdere bronnen te ondersteunen. android-browser-helper heeft een voorbeeldtoepassing voor vertrouwde webactiviteiten met meerdere bronnen. Controleer deze zeker.

Probleemoplossing

Het instellen van Digital Asset Links bestaat uit een aantal bewegende onderdelen. Als de applicatie nog steeds de balk Aangepaste tabbladen bovenaan weergeeft, is er waarschijnlijk iets mis met de configuratie.

De Trusted Web Activity Quick Start Guide bevat een uitgebreid gedeelte over het oplossen van problemen met Digital Asset Link.

Ook is er de fantastische Peter's Asset Link Tool , die helpt bij het debuggen van Digital Asset Links in applicaties die op het apparaat zijn geïnstalleerd.