TWA 的 PostMessage

透過集合功能整理內容 你可以依據偏好儲存及分類內容。

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

<service android:name="androidx.browser.customtabs.PostMessageService" android:exported="true"/> 

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 CustomTabsClient client) {    mClient = client;     // Note: validateRelationship requires warmup to have been called.    client.warmup(0L);     mSession = mClient.newSession(customTabsCallback);  }   @Override  public void onServiceDisconnected(ComponentName componentName) {    mClient = null;  } }); 

private final String TAG = "TWA/CCT-PostMessageDemo";  // The origin the TWA is equivalent to, where the Digital Asset Links file // was created with the "use_as_origin" relationship. private Uri SOURCE_ORIGIN = Uri.parse("https://source-origin.example.com");  // The origin the TWA will communicate with. In most cases, SOURCE_ORIGIN and // TARGET_ORIGIN will be the same. private Uri TARGET_ORIGIN = Uri.parse("https://target-origin.example.com");  // It stores the validation result so you can check on it before requesting // postMessage channel, since without successful validation it is not possible // to use postMessage. boolean mValidated;  CustomTabsCallback customTabsCallback = new CustomTabsCallback() {      // Listens for the validation result, you can use this for any kind of     // logging purposes.     @Override     public void onRelationshipValidationResult(int relation, @NonNull Uri requestedOrigin,         boolean result, @Nullable Bundle extras) {         // If this fails:         // - Have you called warmup?         // - Have you set up Digital Asset Links correctly?         // - Double check what browser you're using.         Log.d(TAG, "Relationship result: " + result);         mValidated = result;     }      // Listens for any navigation happens, it waits until the navigation finishes     // then requests post message channel using     // CustomTabsSession#requestPostMessageChannel(sourceUri, targetUri, extrasBundle)      // The targetOrigin in requestPostMessageChannel means that you can be certain their messages are delivered only to the website you expect.     @Override     public void onNavigationEvent(int navigationEvent, @Nullable Bundle extras) {         if (navigationEvent != NAVIGATION_FINISHED) {             return;         }          if (!mValidated) {             Log.d(TAG, "Not starting PostMessage as validation didn't succeed.");         }          // If this fails:         // - Have you included PostMessageService in your AndroidManifest.xml ?         boolean result = mSession.requestPostMessageChannel(SOURCE_ORIGIN, TARGET_ORIGIN, new Bundle());         Log.d(TAG, "Requested Post Message Channel: " + result);     }      // This gets called when the channel we requested is ready for sending/receiving messages.     @Override     public void onMessageChannelReady(@Nullable Bundle extras) {         Log.d(TAG, "Message channel ready.");          int result = mSession.postMessage("First message", null);         Log.d(TAG, "postMessage returned: " + result);     }      // Listens for upcoming messages from Web.     @Override     public void onPostMessage(@NonNull String message, @Nullable Bundle extras) {         super.onPostMessage(message, extras);         // Handle the received message.     } }; 

window.addEventListener("message", function (event) {   // We are receiveing messages from any origin, you can check of the origin by   // using event.origin    // get the port then use it for communication.   var port = event.ports[0];   if (typeof port === 'undefined') return;    // Post message on this port.   port.postMessage("Test")    // Receive upcoming messages on this port.   port.onmessage = function(event) {     console.log("[PostMessage1] Got message" + event.data);   }; });