भरोसेमंद वेब गतिविधि सेट अप करने के लिए, डेवलपर को लेखक की ज़रूरत नहीं होती है Java कोड मौजूद है, लेकिन Android Studio आवश्यक है. यह गाइड Android Studio 3.3 का इस्तेमाल करके बनाई गई है. इसे इंस्टॉल करने के तरीके के बारे में दस्तावेज़ देखें.
भरोसेमंद वेब गतिविधि प्रोजेक्ट बनाना
भरोसेमंद वेब गतिविधियों का इस्तेमाल करते समय, प्रोजेक्ट को एपीआई लेवल 16 या उसके बाद के वर्शन को टारगेट करना होगा.
Android Studio खोलें और नया Android Studio प्रोजेक्ट शुरू करें पर क्लिक करें.
Android Studio में, आपको ऐक्टिविटी टाइप चुनने का विकल्प मिलेगा. भरोसेमंद वेब गतिविधियां, सहायता लाइब्रेरी से मिली गतिविधि, कोई गतिविधि न जोड़ें चुनें और क्लिक करें आगे बढ़ें पर टैप करें.
अगला चरण, विज़र्ड प्रोजेक्ट के कॉन्फ़िगरेशन के लिए पूछेगा. यहाँ है हर फ़ील्ड का छोटा ब्यौरा:
- नाम: वह नाम जिसका इस्तेमाल Android लॉन्चर.
- पैकेज का नाम: Android ऐप्लिकेशन के लिए Play Store और Android डिवाइस पर. सेटअप के निर्देश देखें दस्तावेज़ पैकेज बनाने की ज़रूरी शर्तों और सबसे सही तरीकों की ज़्यादा जानकारी के लिए Android ऐप्लिकेशन के नाम.
- जगह की जानकारी सेव करें: इसमें Android Studio, फ़ाइल में प्रोजेक्ट बनाएगा सिस्टम.
- भाषा: प्रोजेक्ट में किसी Java या Kotlin कोड को लिखने की ज़रूरत नहीं होती है. डिफ़ॉल्ट के रूप में, Java चुनें.
- एपीआई लेवल का कम से कम लेवल: सपोर्ट लाइब्रेरी के लिए, कम से कम एपीआई लेवल 16 की ज़रूरत होती है. ऊपर दिए गए एपीआई 16 के किसी भी वर्शन को चुनें.
बाकी चेकबॉक्स पर सही का निशान न लगाएं, क्योंकि हम इंस्टैंट ऐप्लिकेशन का इस्तेमाल नहीं करेंगे या AndroidX आर्टफ़ैक्ट पर क्लिक करें और पूरा करें पर क्लिक करें.
भरोसेमंद वेब गतिविधि से जुड़ी सहायता लाइब्रेरी पाएं
प्रोजेक्ट में भरोसेमंद वेब गतिविधि की लाइब्रेरी सेट अप करने के लिए, आपको ऐप्लिकेशन में बदलाव करना होगा
बिल्ड फ़ाइल. प्रोजेक्ट नेविगेटर में Gradle स्क्रिप्ट सेक्शन ढूंढें.
build.gradle नाम की दो फ़ाइलें होती हैं, जो समझने में थोड़ी मुश्किल हो सकती हैं और
ब्रैकेट में मौजूद ब्यौरा, सही ब्रैकेट की पहचान करने में मदद करता है.
हमें जिस फ़ाइल की तलाश है वह नाम.
भरोसेमंद वेब ऐक्टिविटी लाइब्रेरी, इन चीज़ों का इस्तेमाल करती है
Java 8 की सुविधाएं
और पहला बदलाव Java 8 को चालू करता है. compileOptions सेक्शन को इसमें जोड़ें
android सेक्शन में सबसे नीचे, जैसा कि नीचे बताया गया है:
android {
...
compileOptions {
sourceCompatibility JavaVersion.VERSION_1_8
targetCompatibility JavaVersion.VERSION_1_8
}
}
अगले चरण में, प्रोजेक्ट में भरोसेमंद वेब गतिविधि के लिए सहायता लाइब्रेरी जोड़ दी जाएगी. नई प्रोफ़ाइल बनाएं
यह dependencies सेक्शन पर निर्भर करता है:
dependencies {
implementation 'com.google.androidbrowserhelper:androidbrowserhelper:2.2.0'
}
Android Studio में, प्रोजेक्ट को एक बार फिर से सिंक करने के लिए कहा जाएगा. अभी सिंक करें लिंक पर क्लिक करें और उसे सिंक करें.
भरोसेमंद वेब गतिविधि लॉन्च करें
विश्वसनीय वेब गतिविधि सेट अप करने का चरण Android ऐप्लिकेशन मेनिफ़ेस्ट.
Project Navigator पर, ऐप्लिकेशन सेक्शन को बड़ा करें. इसके बाद,
मेनिफ़ेस्ट पर जाएं और फ़ाइल को खोलने के लिए AndroidManifest.xml पर दो बार क्लिक करें.
हमने Android Studio को तब अपने प्रोजेक्ट में कोई गतिविधि नहीं जोड़ने को कहा इसे बनाते समय, मेनिफ़ेस्ट खाली होता है और उसमें सिर्फ़ ऐप्लिकेशन टैग शामिल होता है.
application टैग में activity टैग डालकर, भरोसेमंद वेब गतिविधि जोड़ें:
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
package="com.example.twa.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="com.google.androidbrowserhelper.trusted.LauncherActivity">
<!-- Edit android:value to change the url opened by the Trusted Web Activity -->
<meta-data
android:name="android.support.customtabs.trusted.DEFAULT_URL"
android:value="https://airhorner.com" />
<!-- This intent-filter adds the Trusted Web Activity 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 Trusted Web Activity 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>
एक्सएमएल में जोड़े गए टैग स्टैंडर्ड हैं Android ऐप्लिकेशन मेनिफ़ेस्ट. भरोसेमंद वेब के संदर्भ के लिए दो काम की जानकारी होती है गतिविधियां:
meta-dataटैग, भरोसेमंद वेब गतिविधि को बताता है कि उसे कौनसा यूआरएल खोलना चाहिए. चैनल केandroid:valueएट्रिब्यूट को उस PWA के यूआरएल के साथ सबमिट करें जिसे आपको खोलना है. तय सीमा में इस उदाहरण में, यहhttps://airhorner.comहै.- दूसरा
intent-filterटैग भरोसेमंद वेब गतिविधि को Android में रुकावट डालने देता है ऐसे इंटेंट जोhttps://airhorner.comको खोलते हैं.android:hostएट्रिब्यूटdataटैग के अंदर, भरोसेमंद वेब गतिविधि से खोले जाने वाले डोमेन की ओर इशारा करना चाहिए.
अगले सेक्शन में, आपको सेटअप करने का तरीका बताया जाएगा डिजिटल ऐसेट लिंक वेबसाइट और ऐप्लिकेशन के बीच के संबंध की पुष्टि करने के लिए, और यूआरएल बार को हटाएं.
यूआरएल बार हटाएं
विश्वसनीय वेब गतिविधियों के लिए Android ऐप्लिकेशन के बीच संबंध की ज़रूरत होती है और यूआरएल बार हटाने के लिए बनाई जाने वाली वेबसाइट पर जाएं.
यह असोसिएशन इनके ज़रिए बनाया गया है डिजिटल ऐसेट लिंक और असोसिएशन को इन दोनों तरीकों से बनाया जाना चाहिए: ऐप्लिकेशन से वेबसाइट तक और वेबसाइट से ऐप्लिकेशन तक.
ऐप्लिकेशन को वेबसाइट की पुष्टि करने के लिए सेट अप किया जा सकता है. साथ ही, Chrome को स्किप करने के लिए सेट अप किया जा सकता है डीबग करने के मकसद से, वेबसाइट से ऐप्लिकेशन की पुष्टि करना.
ऐप्लिकेशन और वेबसाइट के बीच कनेक्शन बनाना
स्ट्रिंग रिसॉर्स फ़ाइल app > res > values > strings.xml खोलें और
डिजिटल ऐसेट लिंक का स्टेटमेंट:
<resources>
<string name="app_name">AirHorner Trusted Web Activity</string>
<string name="asset_statements">
[{
\"relation\": [\"delegate_permission/common.handle_all_urls\"],
\"target\": {
\"namespace\": \"web\",
\"site\": \"https://airhorner.com\"}
}]
</string>
</resources>
site एट्रिब्यूट के कॉन्टेंट में बदलाव करें, ताकि वे स्कीमा और डोमेन से मेल खा सकें
भरोसेमंद वेब गतिविधि ने खोला है.
Android ऐप्लिकेशन मेनिफ़ेस्ट फ़ाइल AndroidManifest.xml पर वापस जाएं और
एक नया meta-data टैग जोड़कर स्टेटमेंट देख सकते हैं, लेकिन इस बार
application टैग:
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.twa.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">
<meta-data
android:name="asset_statements"
android:resource="@string/asset_statements" />
<activity>
...
</activity>
</application>
</manifest>
अब हमने Android ऐप् लिकेशन से वेबसाइट. संबंध के इस हिस्से को बिना बनाए डीबग करने से मदद मिलती है ऐप्लिकेशन की पुष्टि करने के लिए वेबसाइट पर जाएं.
डेवलपमेंट डिवाइस पर इसकी जांच करने का तरीका यहां बताया गया है:
डीबग मोड चालू करना
- डेवलपमेंट डिवाइस पर Chrome खोलें,
chrome://flagsपर जाएं, खोजें बिना रूट वाले डिवाइसों पर कमांड लाइन चालू करें नाम के आइटम के लिए और उसे बदलने के लिए को चालू पर सेट करें और फिर ब्राउज़र को रीस्टार्ट करें. - फिर, अपने ऑपरेटिंग सिस्टम के Terminal ऐप्लिकेशन में, Android डीबग ब्रिज (Android Studio के साथ इंस्टॉल किया गया है) और ये निर्देश चलाएं:
adb shell "echo '_ --disable-digital-asset-link-verification-for-url=\"https://airhorner.com\"' > /data/local/tmp/chrome-command-line"
Chrome को बंद करें और Android Studio से अपना ऐप्लिकेशन फिर से लॉन्च करें. कॉन्टेंट बनाने ऐप्लिकेशन अब फ़ुल-स्क्रीन में दिखना चाहिए.
वेबसाइट और ऐप्लिकेशन के बीच कनेक्शन बनाएं
डेवलपर को दो तरह की जानकारी इकट्ठा करनी होगी असोसिएशन बनाने के लिए:
- पैकेज का नाम: पहली जानकारी ऐप्लिकेशन के पैकेज का नाम होती है. यह
पैकेज का वही नाम है जो ऐप्लिकेशन बनाते समय जनरेट हुआ है. यह जानकारी भी पाई जा सकती है
मॉड्यूल
build.gradleके अंदर, ग्रेडल स्क्रिप्ट > बिल्ड.gradle (मॉड्यूल: ऐप्लिकेशन) में शामिल किया जाता है और यहapplicationIdएट्रिब्यूट की वैल्यू सबमिट करें. - SHA-256 फ़िंगरप्रिंट: Android ऐप्लिकेशन में साइन इन होना ज़रूरी है, ताकि Play Store पर अपलोड किया गया हो. एक ही हस्ताक्षर का इस्तेमाल करके, के SHA-256 फ़िंगरप्रिंट के ज़रिए वेबसाइट और ऐप्लिकेशन के बीच कनेक्शन अपलोड पासकोड पर क्लिक करें.
Android के दस्तावेज़ में, Android Studio का इस्तेमाल करके पासकोड जनरेट करने के तरीके के बारे में पूरी जानकारी दी गई है. कुंजी स्टोर के लिए पाथ, उपनाम और पासवर्ड को ध्यान से नोट करें, जैसा कि अगले चरण में आपको इसकी ज़रूरत पड़ेगी.
SHA-256 फ़िंगरप्रिंट एक्सट्रैक्ट करने के लिए कीटूल, नीचे दिए गए निर्देश से निर्देश दिया जाता है:
keytool -list -v -keystore [path] -alias [alias] -storepass [password] -keypass [password]
SHA-256 फ़िंगरप्रिंट की वैल्यू सर्टिफ़िकेट के अंदर प्रिंट होती है फ़िंगरप्रिंट सेक्शन में. आउटपुट का एक उदाहरण यहां दिया गया है:
keytool -list -v -keystore ./mykeystore.ks -alias test -storepass password -keypass password
Alias name: key0
Creation date: 28 Jan 2019
Entry type: PrivateKeyEntry
Certificate chain length: 1
Certificate[1]:
Owner: CN=Test Test, OU=Test, O=Test, L=London, ST=London, C=GB
Issuer: CN=Test Test, OU=Test, O=Test, L=London, ST=London, C=GB
Serial number: ea67d3d
Valid from: Mon Jan 28 14:58:00 GMT 2019 until: Fri Jan 22 14:58:00 GMT 2044
Certificate fingerprints:
SHA1: 38:03:D6:95:91:7C:9C:EE:4A:A0:58:43:A7:43:A5:D2:76:52:EF:9B
SHA256: F5:08:9F:8A:D4:C8:4A:15:6D:0A:B1:3F:61:96:BE:C7:87:8C:DE:05:59:92:B2:A3:2D:05:05:A5:62:A5:2F:34
Signature algorithm name: SHA256withRSA
Subject Public Key Algorithm: 2048-bit RSA key
Version: 3
दोनों तरह की जानकारी को ध्यान में रखते हुए, ऐसेट लिंक जनरेट करने वाले टूल पर जाएं.
फ़ील्ड भरें और स्टेटमेंट जनरेट करें पर क्लिक करें. जनरेट किया गया स्टेटमेंट कॉपी करें
और इसे /.well-known/assetlinks.json यूआरएल से अपने डोमेन से दिखा सकता है.
कोई आइकॉन बनाना
जब Android Studio कोई नया प्रोजेक्ट बनाता है, तो उसके साथ एक डिफ़ॉल्ट आइकॉन दिखता है. डेवलपर के रूप में, आप अपना खुद का आइकन बनाना चाहेंगे और अपने Android लॉन्चर पर दूसरे ऐप्लिकेशन से डाउनलोड करने की सुविधा देता है.
Android Studio में Image Asset Studio होता है, यह टूल, हर उपयोगकर्ता की ज़रूरत के हिसाब से सही आइकॉन बनाने में मदद करता है. समाधान और अपने ऐप्लिकेशन की ज़रूरतों को पूरा करने में मदद करता है.
Android Studio में, File > New > Image Asset पर जाएं. इसके बाद,
Launcher Icons (Adaptative and Legacy) पर क्लिक करें और विज़र्ड के निर्देशों का पालन करें.
ऐप्लिकेशन के लिए कस्टम आइकन बनाने के लिए.
हस्ताक्षर किया हुआ APK जनरेट करना
जब आपके डोमेन में assetlinks फ़ाइल और asset_statements टैग मौजूद हो
कॉन्फ़िगर किया गया है, तो अगला चरण साइन किया गया ऐप्लिकेशन जनरेट करना है.
इसके लिए एक बार फिर से कहा जाता है कि
दस्तावेज़ किए गए.
आउटपुट APK को adb का इस्तेमाल करके, टेस्ट डिवाइस में इंस्टॉल किया जा सकता है:
adb install app-release.apk
अगर पुष्टि नहीं हो पाती है, तो गड़बड़ी की जांच की जा सकती है आपके OS के टर्मिनल से और टेस्ट डिवाइस कनेक्ट हो गया.
adb logcat | grep -e OriginVerifier -e digital_asset_links
अपलोड किए गए APK को जनरेट करके, अब आपके पास ऐप्लिकेशन को Play Store में अपलोड करने का विकल्प है.
स्प्लैश स्क्रीन जोड़ना
Chrome 75 से, भरोसेमंद वेब गतिविधियों के ज़रिए स्प्लैश स्क्रीन के लिए सहायता मिलती है. स्प्लैश स्क्रीन को सेट अप करने के लिए, प्रोजेक्ट.
Chrome 75 या उसके बाद के वर्शन पर अपडेट करना न भूलें. साथ ही, Android ऐप्लिकेशन में भरोसेमंद वेब गतिविधि से जुड़ी सहायता लाइब्रेरी का नया वर्शन.
स्प्लैश स्क्रीन के लिए इमेज जनरेट करना
Android डिवाइसों की स्क्रीन साइज़ अलग-अलग हो सकते हैं और पिक्सल डेंसिटी के हिसाब से फ़िल्टर करें. स्प्लैश स्क्रीन की सुविधा सभी डिवाइसों पर अच्छी दिखे, इसके लिए ज़रूरी है कि हर पिक्सल की सघनता के लिए इमेज.
डिसप्ले-इंडिपेंडेंट पिक्सल (डीपी या डिप) के बारे में पूरी जानकारी लेख के दायरे से बाहर है, लेकिन एक उदाहरण यह हो सकता है कि ऐसी इमेज बनाई जाए जो 320x320dp का है, जो किसी भी सघनता वाले डिवाइस की स्क्रीन पर 2x2 इंच के स्क्वेयर को दिखाता है और mdpi सघनता पर 320x320 pixel के बराबर होता है.
यहां से हम अन्य पिक्सल डेंसिटी के लिए ज़रूरी साइज़ जान सकते हैं. नीचे एक सूची दी गई है पिक्सल डेंसिटी के साथ, बेस साइज़ (320x320dp) पर मल्टीप्लायर लागू किया गया नतीजे के तौर पर पिक्सल में साइज़ और वह जगह जहां इमेज जोड़ी जानी चाहिए Android Studio प्रोजेक्ट.
| घनत्व | मल्टीप्लायर | साइज़ | प्रोजेक्ट की जगह |
|---|---|---|---|
| mdpi (बेसलाइन) | 1.0x | 320x320 पिक्सल | /res/drawable-mdpi/ |
| ldpi | 0.75x | 240x240 पिक्सल | /res/drawable-ldpi/ |
| hdpi | 1.5x | 480x480 पिक्सल | /res/drawable-hdpi/ |
| xhdpi | 2.0x | 640x640 पिक्सल | /res/drawable-xhdpi/ |
| xxhdpi | 3.0 गुना | 960x960 पिक्सल | /res/drawable-xxhdpi/ |
| xxxhdpi | 4.0 गुना | 1280x1280 पिक्सल | /res/drawable-xxxhdpi/ |
ऐप्लिकेशन अपडेट किया जा रहा है
स्प्लैश स्क्रीन के लिए इमेज जनरेट करने के बाद, ज़रूरी जानकारी जोड़ें कॉन्फ़िगरेशन के बारे में जानकारी शामिल करनी होगी.
सबसे पहले, content-provider जोड़ें
को Android मेनिफ़ेस्ट (AndroidManifest.xml) में जोड़ा जा सकता है.
<application>
...
<provider
android:name="androidx.core.content.FileProvider"
android:authorities="com.example.twa.myapplication.fileprovider"
android:grantUriPermissions="true"
android:exported="false">
<meta-data
android:name="android.support.FILE_PROVIDER_PATHS"
android:resource="@xml/filepaths" />
</provider>
</application>
इसके बाद, res/xml/filepaths.xml संसाधन जोड़ें और Twa स्प्लैश स्क्रीन का पाथ तय करें:
<paths>
<files-path path="twa_splash/" name="twa_splash" />
</paths>
आखिर में, LauncherActivity को पसंद के मुताबिक बनाने के लिए, Android मेनिफ़ेस्ट में meta-tags जोड़ें:
<activity android:name="com.google.androidbrowserhelper.trusted.LauncherActivity">
...
<meta-data android:name="android.support.customtabs.trusted.SPLASH_IMAGE_DRAWABLE"
android:resource="@drawable/splash"/>
<meta-data android:name="android.support.customtabs.trusted.SPLASH_SCREEN_BACKGROUND_COLOR"
android:resource="@color/colorPrimary"/>
<meta-data android:name="android.support.customtabs.trusted.SPLASH_SCREEN_FADE_OUT_DURATION"
android:value="300"/>
<meta-data android:name="android.support.customtabs.trusted.FILE_PROVIDER_AUTHORITY"
android:value="com.example.twa.myapplication.fileprovider"/>
...
</activity>
पक्का करें कि android.support.customtabs.trusted.FILE_PROVIDER_AUTHORITY
टैग android:authorities एट्रिब्यूट के अंदर दी गई वैल्यू से मेल खाता है
provider टैग के साथ किया जा सकता है.
LauncherActivity को पारदर्शी बनाया जा रहा है
इसके अलावा, पक्का करें कि LauncherActivity पारदर्शी हो, ताकि व्हाइट स्क्रीन न दिखे इसके लिए, LauncherActivity के लिए पारदर्शी थीम सेट करने की सुविधा मिलती है:
<application>
...
<activity android:name="com.google.androidbrowserhelper.trusted.LauncherActivity"
android:theme="@android:style/Theme.Translucent.NoTitleBar">
...
</activity>
</application>
हम यह देखने के लिए उत्साहित हैं कि डेवलपर विश्वसनीय वेब के साथ क्या-क्या बनाते हैं गतिविधियां. कोई सुझाव/राय देने या शिकायत करने के लिए, हमसे संपर्क करें: @ChromiumDev.