Ab Chrome 115 können vertrauenswürdige Web-Aktivitäten mithilfe von postMessage Nachrichten senden. In diesem Dokument wird die Einrichtung beschrieben, die für die Kommunikation zwischen Ihrer App und dem Web erforderlich ist.
Am Ende dieses Leitfadens können Sie:
- Informationen zur Funktionsweise der Client- und Webcontent-Validierung
- Sie müssen wissen, wie Sie den Kommunikationskanal zwischen Client und Webcontent initialisieren.
- Sie wissen, wie Sie Nachrichten an Webcontent senden und von Webcontent empfangen.
Für diese Anleitung benötigen Sie Folgendes:
- Fügen Sie Ihrer build.gradle-Datei die neueste androidx.browser-Bibliothek (mind. Version 1.6.0-alpha02) hinzu.
- Chrome-Version 115.0.5790.13 oder höher für TWA
Die Methode window.postMessage() ermöglicht eine sichere plattformübergreifende Kommunikation zwischen Window-Objekten. Beispielsweise zwischen einer Seite und einem Pop-up, das von ihr gestartet wurde, oder zwischen einer Seite und einem darin eingebetteten Iframe.
Normalerweise dürfen Scripts auf verschiedenen Seiten nur dann aufeinander zugreifen, wenn die Seiten denselben Ursprung haben, dasselbe Protokoll, dieselbe Portnummer und denselben Host verwenden (auch als Same-Origin-Richtlinie bezeichnet). Die window.postMessage()-Methode bietet einen kontrollierten Mechanismus für die sichere Kommunikation zwischen verschiedenen Ursprüngen. Das kann für die Implementierung von Chatanwendungen, Tools für die Zusammenarbeit und anderen Anwendungen nützlich sein. Eine Chat-Anwendung könnte beispielsweise postMessage verwenden, um Nachrichten zwischen Nutzern zu senden, die sich auf verschiedenen Websites befinden.
Die Verwendung von postMessage in vertrauenswürdigen Web-Aktivitäten (Trusted Web Activities, TWA) kann etwas schwierig sein. In diesem Leitfaden wird beschrieben, wie Sie mit postMessage im TWA-Client Nachrichten an die Webseite senden und von ihr empfangen.
App zur Webüberprüfung hinzufügen
Mit der postMessage API können zwei gültige Ursprünge miteinander kommunizieren, eine Quelle und ein Ziel. Damit die Android-Anwendung Nachrichten an den Zielursprung senden kann, muss sie angeben, mit welchem Quellursprung sie übereinstimmt. Das ist mit Digital Asset Links (DAL) möglich. Fügen Sie dazu den Paketnamen der App in die Datei assetlinks.json mit der Beziehung use_as_origin ein. Das sieht dann so aus:
[{
"relation": ["delegate_permission/common.use_as_origin"],
"target" : { "namespace": "android_app", "package_name": "com.example.app", "sha256_cert_fingerprints": [""] }
}]
Hinweis: Bei der Einrichtung am Ursprung, der mit der TWA verknüpft ist, muss ein Ursprung für das Feld MessageEvent.origin angegeben werden. postMessage kann jedoch für die Kommunikation mit anderen Websites verwendet werden, die keinen Digital Assets-Link enthalten. Wenn Sie beispielsweise Inhaber von www.example.com sind, müssen Sie dies über DAL nachweisen. Sie können aber mit anderen Websites kommunizieren, z. B. mit www.wikipedia.org.
PostMessageService zum Manifest hinzufügen
Wenn Sie postMessage-Kommunikation erhalten möchten, müssen Sie den Dienst einrichten. Fügen Sie dazu PostMessageService in Ihr Android-Manifest ein:
<service android:name="androidx.browser.customtabs.PostMessageService"
android:exported="true"/>
Instanz von CustomTabsSession abrufen
Nachdem Sie den Dienst dem Manifest hinzugefügt haben, verwenden Sie die Klasse CustomTabsClient, um den Dienst zu binden. Sobald die Verbindung hergestellt ist, können Sie mit dem bereitgestellten Client eine neue Sitzung erstellen:
CustomTabsSession ist die Hauptklasse für die Verarbeitung der postMessage API. Im folgenden Code wird gezeigt, wie nach der Verbindung des Dienstes der Client verwendet wird, um eine neue Sitzung zu erstellen. Diese Sitzung wird für Folgendes verwendet: postMessage
private CustomTabsClient mClient;
private CustomTabsSession mSession;
// We use this helper method to return the preferred package to use for
// Custom Tabs.
String packageName = CustomTabsClient.getPackageName(this, null);
// Binding the service to (packageName).
CustomTabsClient.bindCustomTabsService(this, packageName, new CustomTabsServiceConnection() {
@Override
public void onCustomTabsServiceConnected(@NonNull ComponentName name,
@NonNull