اولین باری که کاربر یک برنامه وب مترقی (PWA) را از طریق فعالیت وب قابل اعتماد راه اندازی می کند ، کارگر سرویس هنوز در دسترس نخواهد بود زیرا هنوز روند ثبت نام انجام نشده است. علاوه بر این ، اگر کاربر در اولین راه اندازی برنامه ، به جای تجربه آفلاین سفارشی ، اتصال ندارد ، صفحه خطای شبکه نشان داده می شود.
نمونه ای از این سناریو ممکن است پس از دانلود PWA توسط کاربر از Play Store انجام شود. اگر کاربر هنگام تلاش برای باز کردن برنامه برای اولین بار از اتصال برخوردار نیست ، بنابراین کارگر سرویس برای نمایش صفحه سقوط آفلاین در دسترس نخواهد بود. صفحه خطای استاندارد نشان داده می شود که منجر به تجربه بدی می شود.
این راهنما نحوه نمایش فعالیت خود را در این شرایط با بررسی وضعیت شبکه قبل از راه اندازی فعالیت وب قابل اعتماد توضیح می دهد.
یک LauncherActivity سفارشی ایجاد کنید
اولین قدم ایجاد یک فعالیت راهانداز سفارشی است. این Activity
که حاوی صفحه آفلاین است تا نشان دهد اولین باری که کاربر برنامه را باز می کند اتصالی وجود ندارد یا خیر.
Activity OfflineFirstTWALauncherActivity
را فراخوانی کنید و آن را گسترش دهید: com.google.androidbrowserhelper.trusted.LauncherActivity
.
import com.google.androidbrowserhelper.trusted.LauncherActivity;
public class OfflineFirstTWALauncherActivity extends LauncherActivity {
}
سپس، Activity را در 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
را به عنوان یک فعالیت راهانداز ثبت میکند و https://airhorner.com را بهعنوان URL برای باز کردن هنگام راهاندازی TWA تعریف میکند.
سناریوهای آفلاین را مدیریت کنید
ابتدا، در داخل Activity، متد shouldLaunchImmediately()
را نادیده بگیرید و آن را false
برگردانید تا Trusted Web Activity فوراً راه اندازی نشود. همچنین می توانید چک های اضافی را قبل از راه اندازی اولیه اضافه کنید:
@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;
}
برای بررسی وضعیت شبکه قبل از راه اندازی TWA، روش 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()
که در کلاس والد تعریف شده است فراخوانی کنید تا فعالیت وب مورد اعتماد را مستقیماً راه اندازی کنید. - اگر TWA قبلاً راهاندازی نشده است و کاربر آنلاین است، برای اولین بار با استفاده از متد
firstTimeLaunchTwa()
که بعداً پیادهسازی میکنید، فعالیت وب مورد اعتماد را راهاندازی کنید. - اگر TWA قبلاً راه اندازی نشده است و کاربر آفلاین است، صفحه بازگشتی آفلاین بومی را رندر کنید.
روش های کمکی را اجرا کنید
مرحله آخر پیاده سازی متدهای کمکی است که توسط کد قبلی فراخوانی شده اند. این کد برای بررسی وضعیت آفلاین isOnline()
است:
private boolean isOnline() {
ConnectivityManager connectivityManager = (ConnectivityManager) getSystemService(Context.CONNECTIVITY_SERVICE);
NetworkInfo activeNetworkInfo = connectivityManager.getActiveNetworkInfo();
return activeNetworkInfo != null && activeNetworkInfo.isConnected();
}
سپس، hasTwaLaunchedSuccessfully()
را پیاده سازی کنید، که بررسی می کند آیا TWA حداقل یک بار راه اندازی شده است یا خیر:
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
را در تنظیمات برگزیده مشترک ذخیره می کند. این نشان می دهد که TWA حداقل یک بار با موفقیت راه اندازی شده است.
روش کمکی باقی مانده، renderOfflineFallback()
یک صفحه آفلاین اندروید را ارائه می کند.
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();
}
});
}
Fort his demo, we have defined the activity_offline_first_twa
layout, which contains a button to retry, which will, in time, to execute firstTimeLaunchTwa()
after checking the connection.
نتیجه گیری
- اولین باری که کاربر یک برنامه وب پیشرو (PWA) را از طریق فعالیت وب معتمد راه اندازی می کند، سرویس دهنده هنوز در دسترس نخواهد بود.
- برای جلوگیری از نمایش صفحه استاندارد آفلاین در صورتی که کاربر اتصالی نداشته باشد، می توانید وضعیت آفلاین را تشخیص داده و به جای آن یک صفحه آفلاین بازگشتی نشان دهید.
- در این راهنما نحوه اجرای آن استراتژی را یاد گرفتید. اگر علاقه مند به بررسی کدی هستید که ما در این راهنما استفاده کرده ایم، می توانید راه حل کامل را در نسخه آفلاین First TWA بیابید.