ऑफ़लाइन-पहली भरोसेमंद वेब गतिविधियां

जब कोई उपयोगकर्ता भरोसेमंद वेब गतिविधि के ज़रिए पहली बार प्रोग्रेसिव वेब ऐप्लिकेशन (PWA) लॉन्च करता है, तो सर्विस वर्कर अभी तक उपलब्ध नहीं होगा, क्योंकि रजिस्ट्रेशन प्रोसेस अभी तक पूरी नहीं हुई है. इसके अलावा, अगर पहले ऐप्लिकेशन लॉन्च के दौरान उपयोगकर्ता के पास कनेक्टिविटी नहीं होती, तो पसंद के मुताबिक ऑफ़लाइन अनुभव के बजाय, नेटवर्क की गड़बड़ी वाला पेज दिखता है.

ऐसा तब हो सकता है, जब उपयोगकर्ता Play Store से PWA डाउनलोड करे. अगर पहली बार ऐप्लिकेशन खोलते समय उपयोगकर्ता के पास कनेक्टिविटी नहीं है, तो सर्विस वर्कर ऑफ़लाइन फ़ॉलबैक पेज दिखाने के लिए उपलब्ध नहीं होगा. गड़बड़ी वाला स्टैंडर्ड पेज दिखाया जाएगा, जिससे आपको खराब अनुभव मिलेगा.

TWA ऑफ़लाइन: स्टैंडर्ड ऑफ़लाइन पेज

इस गाइड में बताया गया है कि इस स्थिति में अपनी गतिविधि कैसे दिखाई जाए. इसके लिए, भरोसेमंद वेब गतिविधि लॉन्च करने से पहले नेटवर्क की स्थिति जांचकर देखें.

पसंद के मुताबिक LauncherActivity बनाना

सबसे पहले, लॉन्चर में अपने हिसाब से गतिविधि करें. इस Activity में, ऑफ़लाइन स्क्रीन होगी. इससे यह पता चलेगा कि जब कोई उपयोगकर्ता पहली बार ऐप्लिकेशन खोलता है, तो इंटरनेट कनेक्टिविटी नहीं होती.

गतिविधि OfflineFirstTWALauncherActivity को कॉल करें और इसकी अवधि बढ़ाएं: com.google.androidbrowserhelper.trusted.LauncherActivity.

import com.google.androidbrowserhelper.trusted.LauncherActivity;

public class OfflineFirstTWALauncherActivity extends LauncherActivity {

}

इसके बाद, गतिविधि को AndroidManifest.xml में रजिस्टर करें:

<activity android:name=".OfflineFirstTWALauncherActivity" android:theme="@style/Theme.Design.NoActionBar">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
    <!-- 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.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:host="airhorner.com" android:scheme="https" />
    </intent-filter>
</activity>

पिछला कोड, OfflineFirstTWALauncherActivity को लॉन्चर गतिविधि के तौर पर रजिस्टर करता है. साथ ही, TWA लॉन्च होने पर https://airhorner.com को खुलने वाले यूआरएल के रूप में बताता है.

ऑफ़लाइन स्थितियों को मैनेज करना

सबसे पहले, ऐक्टिविटी में shouldLaunchImmediately() तरीके को बदलें और उसे false दिखाएं, ताकि भरोसेमंद वेब गतिविधि तुरंत लॉन्च न हो. ऐप्लिकेशन के शुरुआती लॉन्च से पहले अन्य जांच भी जोड़ी जा सकती है:

@Override
protected boolean shouldLaunchImmediately() {
    // launchImmediately() returns `false` so we can check connection
    // and then render a fallback page or launch the Trusted Web Activity with `launchTwa()`.
    return false;
}

टीडब्ल्यूए (टीडब्ल्यूए) लॉन्च होने से पहले, नेटवर्क की स्थिति की जांच करने के लिए, onCreate() वाला तरीका बदलें. tryLaunchTwa() पर कॉल जोड़ें. यह हेल्पर तरीका है, जिसमें यह लॉजिक शामिल होगा:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    tryLaunchTwa();
}

इसके बाद, tryLaunchTwa() को लागू करें:

private void tryLaunchTwa() {
    // If TWA has already launched successfully, launch TWA immediately.
    // Otherwise, check connection status. If online, launch the Trusted Web Activity with `launchTwa()`.
    // Otherwise, if offline, render the offline fallback screen.
    if (hasTwaLaunchedSuccessfully()) {
        launchTwa();
    } else if (isOnline()) {
        firstTimeLaunchTwa();
    } else {
        renderOfflineFallback();
    }
}

पिछला कोड तीन स्थितियों को हैंडल करता है:

  • अगर TWA पहले लॉन्च हो चुका है, तो सर्विस वर्कर को रजिस्टर किया जा चुका है और PWA ऑफ़लाइन जवाब दे पाएगा. ऐसी स्थिति में, सीधे तौर पर भरोसेमंद वेब गतिविधि लॉन्च करने के लिए, पैरंट क्लास में तय किए गए launchTwa() को कॉल करें.
  • अगर टीडब्ल्यूए पहले लॉन्च नहीं हुआ है और उपयोगकर्ता ऑनलाइन है, तो पहली बार भरोसेमंद वेब गतिविधि लॉन्च करें. इसके लिए firstTimeLaunchTwa() तरीके का इस्तेमाल करें जिसे बाद में लागू किया जाएगा.
  • अगर TWA पहले लॉन्च नहीं हुआ है और उपयोगकर्ता ऑफ़लाइन है, तो नेटिव ऑफ़लाइन फ़ॉलबैक स्क्रीन को रेंडर करें.

हेल्पर तरीके लागू करना

आखिरी चरण में, पिछले कोड के हेल्पर मेथड को लागू करना होता है. ऑफ़लाइन स्थिति isOnline() देखने के लिए कोड यहां दिया गया है:

private boolean isOnline() {
    ConnectivityManager connectivityManager = (ConnectivityManager) getSystemService(Context.CONNECTIVITY_SERVICE);
    NetworkInfo activeNetworkInfo = connectivityManager.getActiveNetworkInfo();
    return activeNetworkInfo != null && activeNetworkInfo.isConnected();
}

इसके बाद, hasTwaLaunchedSuccessfully() लागू करें. इससे यह पता चलता है कि टीडब्ल्यूए कम से कम एक बार लॉन्च हुआ है या नहीं:

private boolean hasTwaLaunchedSuccessfully() {
    // Return `true` if the preference "twa_launched_successfully" has already been set.
    SharedPreferences sharedPref = getSharedPreferences(getString(R.string.twa_offline_first_preferences_file_key), Context.MODE_PRIVATE);
    return sharedPref.getBoolean(getString(R.string.twa_launched_successfully), false);
}

पिछला कोड, पैरंट क्लास से launchTWA() को कॉल करता है और शेयर की गई प्राथमिकताओं में twa_launched_successfully फ़्लैग को सेव करता है. इससे पता चलता है कि टीडब्ल्यूए कम से कम एक बार लॉन्च हो चुका है.

बचा हुआ हेल्पर तरीका, renderOfflineFallback(), Android की ऑफ़लाइन स्क्रीन को रेंडर करता है.

private void renderOfflineFallback() {
    setContentView(R.layout.activity_offline_first_twa);

    Button retryBtn = this.findViewById(R.id.retry_btn);
    retryBtn.setOnClickListener(new View.OnClickListener() {
        public void onClick(View v) {
            // Check connection status. If online, launch the Trusted Web Activity for the first time.
            if (isOnline()) firstTimeLaunchTwa();
        }
    });
}

इनके डेमो को ध्यान में रखते हुए, हमने activity_offline_first_twa लेआउट के बारे में बताया है. इसमें फिर से कोशिश करने के लिए एक बटन होता है, जिससे कनेक्शन की जांच के बाद firstTimeLaunchTwa() को समय पर लागू किया जा सकेगा.

twa ऑफ़लाइन - कस्टम ऑफ़लाइन स्क्रीन

नतीजा

  • जब कोई उपयोगकर्ता भरोसेमंद वेब गतिविधि के ज़रिए पहली बार प्रोग्रेसिव वेब ऐप्लिकेशन (PWA) को लॉन्च करता है, तो सर्विस वर्कर उपलब्ध नहीं होता.
  • अगर उपयोगकर्ता के पास कनेक्टिविटी न हो, तो स्टैंडर्ड ऑफ़लाइन स्क्रीन न दिखाने के लिए, ऑफ़लाइन स्थिति का पता लगाया जा सकता है. इसके बजाय, ऑफ़लाइन मोड में फ़ॉलबैक स्क्रीन दिखाई जा सकती है.
  • इस गाइड में, आपने उस रणनीति को लागू करने का तरीका सीखा. अगर आप इस गाइड में इस्तेमाल किए गए कोड के बारे में जानना चाहते हैं, तो ऑफ़लाइन पहले टीडब्ल्यूए डेमो में इसका पूरा समाधान देखें.