TWA (Trusted Web Activities):
Trusted Web Activities are a new way to integrate your web-app content such as your PWA with your Android app using a protocol based on Custom Tabs. A Trusted Web Activity runs a Chrome browser full screen in an Android app, meaning there is no browser UI visible in the app, including the URL bar.
Digital Asset Links :
TWA uses Digital Asset Links to certify ownership. The Digital Asset Links protocol and API enable an app or website to make public, verifiable statements about other apps or websites. For example, a website can declare that it is associated with a specific Android app, or it can declare that it wants to share user credentials with another website.
Steps to build PWA apk:
1. Add the Jetpack configuration in Project levelbuild.gradle
. Under the allprojects
section:
1 2 3 4 5 6 7 |
https://jitpack.io/allprojects { repositories { google() jcenter() maven { url "https://jitpack.io" } } } |
2. Add Java 8 features Module level build.gradle
. Under the compileOptions
section:
1 2 3 4 5 6 7 |
android { ... compileOptions { sourceCompatibility JavaVersion.VERSION_1_8 targetCompatibility JavaVersion.VERSION_1_8 } } |
3. Add the TWA Support Library to the project. Under the dependencies
section:
1 2 3 |
dependencies { implementation 'com.github.GoogleChrome.custom-tabs-client:customtabs:d08e93fce3' } |
4. Add TWA LauncherActivity to the AndroidManifest.xml.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
<manifest xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" package="com.example.myapplication"> <application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" android:theme="@style/AppTheme" tools:ignore="GoogleAppIndexingWarning"> <activity android:name="android.support.customtabs.trusted.LauncherActivity"> <!-- Edit android:value to change the url opened by the TWA --> <meta-data android:name="android.support.customtabs.trusted.DEFAULT_URL" android:value="https://airhorner.com" /> <!-- This intent-filter adds the TWA to the Android Launcher --> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> <!-- This intent-filter allows the TWA to handle Intents to open airhorner.com. --> <intent-filter> <action android:name="android.intent.action.VIEW"/> <category android:name="android.intent.category.DEFAULT" /> <category android:name="android.intent.category.BROWSABLE"/> <!-- Edit android:host to handle links to the target URL--> <data android:scheme="https" android:host="airhorner.com"/> </intent-filter> </activity> </application> </manifest> |
5. Add Digital AssetLinks statement to remove the URL bar.
1 2 3 4 5 6 7 8 9 10 11 |
<resources> <string name="app_name">AirHorner TWA</string> <string name="asset_statements"> [{ \"relation\": [\"delegate_permission/common.handle_all_urls\"], \"target\": { \"namespace\": \"web\", \"site\": \"https://example.com\"} }] </string> </resources> |
We can generate assets links file from URL https://developers.google.com/digital-asset-links/tools/generator. If you will not configure Digital Asset Links JSON file properly then APK will show the URL bar.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
[ { "relation": [ "delegate_permission/common.handle_all_urls" ], "target": { "namespace": "android_app", "package_name": "com.example.app", "sha256_cert_fingerprints": [ "hash_of_app_certificate" ] } } ] |
Package Name: “package_name” is the value of the applicationId
attribute.
SHA-256 Fingerprint: You can generate “sha256_cert_fingerprints” using below command in terminal
Release command “keytool -exportcert -list -v \-aliaskeystorealias -keystore keystorefile.jks”
Debug command “keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android”
At the last put generated file at your host in the folder “.well-known“. It will be accessible publicly making a URL like this -> https://example.com/.well-known/assetlinks.json.
References:
https://developers.google.com/web/fundamentals/integration/webapks