تاریخ انتشار: ۲ دسامبر ۲۰۲۰
از زمان معرفی فعالیت وب مطمئن، تیم Chrome استفاده از آن را با Bubblewrap آسان‌تر کرده است. ویژگی‌های دیگری مثل ادغام «خدمات صورت‌حساب Google Play» را اضافه کرده‌ایم و آن را برای کار در پلاتفرم‌های بیشتری مثل ChromeOS فعال کرده‌ایم.
ویژگی‌های Bubblewrap و «فعالیت وب مطمئن»
Bubblewrap به شما کمک می‌کند برنامه‌هایی ایجاد کنید که «برنامه‌های وب پیش‌رونده» شما را در «فعالیت وب مطمئن» راه‌اندازی کنند، بدون اینکه به دانش ابزارهای خاص پلاتفرم نیاز داشته باشید.
جریان راه‌اندازی ساده‌شده
قبلاً، استفاده از Bubblewrap مستلزم راه‌اندازی دستی «کیت توسعه جاوا» و «کیت توسعه نرم‌افزار Android» بود که هر دو مستعد خطا هستند. این ابزار اکنون پیشنهاد می‌کند که وابستگی‌های خارجی را به‌طور خودکار بارگیری کند وقتی برای اولین‌بار اجرا می‌شود.
اگر ترجیح می‌دهید، همچنان می‌توانید از نصب موجود وابستگی‌ها استفاده کنید،
و فرمان جدید doctor به پیدا کردن مشکلات و توصیه اصلاحات برای پیکربندی کمک می‌کند، که اکنون
می‌توان آن را از خط فرمان بااستفاده از فرمان updateConfig به‌روز کرد.
برنامه نصب بهبودیافته
هنگام ایجاد پروژه با init، Bubblewrap برای تولید برنامه Android به اطلاعات نیاز دارد. این ابزار مقادیر را از «مانیفست برنامه وب» استخراج می‌کند و درصورت امکان مقادیر پیش‌فرض را ارائه می‌دهد.
هنگام ایجاد پروژه جدید می‌توانید این مقادیر را تغییر دهید، اما قبلاً معنی هر فیلد واضح نبود. کادرهای گفتگوی مقداردهی اولیه با شرح‌های بهتر و اعتبارسنجی برای هر فیلد ورودی بازسازی شدند.
پشتیبانی از نمایش تمام‌صفحه و جهت‌یابی
در برخی موارد، ممکن است بخواهید برنامه‌تان تا حد امکان از صفحه‌نمایش استفاده کند و هنگام ساختن برنامه‌های وب پیش‌رونده، این کار با تنظیم فیلد display از «مانیفست برنامه وب» روی fullscreen اجرا می‌شود.
وقتی Bubblewrap گزینه تمام‌صفحه را در «مانیفست برنامه وب» شناسایی می‌کند، برنامه Android را پیکربندی می‌کند تا در حالت تمام‌صفحه یا حالت فراگیر (به‌اصطلاح Android) راه‌اندازی شود.
فیلد orientation از «مانیفست برنامه وب» تعیین می‌کند که برنامه باید در حالت عمودی، حالت افقی، یا در جهتی که دستگاه درحال‌حاضر استفاده می‌کند شروع شود. اکنون Bubblewrap
فیلد «مانیفست برنامه وب» را می‌خواند و از آن به‌عنوان پیش‌فرض هنگام ایجاد برنامه Android استفاده می‌کند.
می‌توانید هر دو پیکربندی را به‌عنوان بخشی از جریان bubblewrap init سفارشی‌سازی کنید.
برونداد AppBundles
دسته‌های برنامه قالب انتشاری برای برنامه‌ها است که تولید و امضای APK نهایی را به Play واگذار می‌کند. در عمل، این کار باعث می‌شود هنگام بارگیری برنامه از فروشگاه، فایل‌های کوچک‌تری به کاربران ارائه شود.
اکنون Bubblewrap برنامه را به‌صورت «دسته برنامه» در فایلی به‌نام
app-release-bundle.aab بسته‌بندی می‌کند. هنگام انتشار برنامه‌ها در «فروشگاه Play»، باید این قالب را ترجیح دهید، زیرا از سال ۲۰۲۱ توسط فروشگاه الزامی شده است.
واگذاری موقعیت جغرافیایی
کاربران انتظار دارند برنامه‌های نصب‌شده در دستگاه‌هایشان، صرف‌نظر از فناوری، رفتار ثابتی داشته باشند. وقتی از اجازه GeoLocation در «فعالیت وب مطمئن» استفاده می‌شود، اکنون می‌توان آن را به «سیستم‌عامل» واگذار کرد و وقتی فعال باشد، کاربران همان کادرهای گفتگویی را می‌بینند که در برنامه‌های ساخته‌شده با Kotlin یا Java می‌بینند و کنترل‌های مدیریت اجازه را در همان مکان پیدا می‌کنند.
این ویژگی را می‌توان ازطریق Bubblewrap اضافه کرد و ازآنجایی‌که وابستگی‌های بیشتری به پروژه Android اضافه می‌کند، فقط زمانی باید آن را فعال کنید که برنامه وب از اجازه «مکان جغرافیایی» استفاده می‌کند.
دودویی‌های بهینه‌سازی‌شده
دستگاه‌های با فضای ذخیره‌سازی محدود در برخی مناطق جهان رایج هستند و مالکان این دستگاه‌ها اغلب برنامه‌های کوچک‌تر را ترجیح می‌دهند. برنامه‌هایی که از «فعالیت وب مطمئن» استفاده می‌کنند، باینری‌های کوچکی تولید می‌کنند که برخی‌از نگرانی‌های این کاربران را برطرف می‌کند.
Bubblewrap با کاهش فهرست کتابخانه‌های Android موردنیاز بهینه‌سازی شده است که درنتیجه دودویی‌های تولیدشده ۸۰۰ کیلوبایت کوچک‌تر شده‌اند. در عمل، این مقدار کمتر از نصف اندازه میانگین تولیدشده توسط نسخه‌های قبلی است. برای بهره‌مندی از باینری‌های کوچک‌تر، فقط باید برنامه‌تان را بااستفاده از جدیدترین نسخه Bubblewrap به‌روز کنید.
نحوه به‌روزرسانی برنامه موجود
برنامه‌ای که توسط Bubblewrap تولید می‌شود از یک برنامه وب و یک پوشاننده سبک Android تشکیل شده است که PWA را باز می‌کند. اگرچه «برنامه وب پیش‌رونده» بازشده در «فعالیت وب مطمئن» از همان چرخه‌های به‌روزرسانی هر برنامه وب دیگری پیروی می‌کند، اما پوشاننده بومی می‌تواند و باید به‌روز شود.
باید برنامه‌تان را به‌روز کنید تا مطمئن شوید از جدیدترین نسخه پوشش‌دهنده با جدیدترین رفع اشکال‌ها و ویژگی‌ها استفاده می‌کند. با نصب جدیدترین نسخه Bubblewrap،
فرمان update جدیدترین نسخه پوشاننده را برای پروژه موجود اعمال می‌کند:
npm update -g @bubblewrap/cli
bubblewrap update
bubblewrap build
دلیل دیگر برای به‌روزرسانی این برنامه‌ها این است که مطمئن شوید تغییرات در مانیفست وب در برنامه اعمال می‌شود. از فرمان جدید merge برای این کار استفاده کنید:
bubblewrap merge
bubblewrap update
bubblewrap build
به‌روزرسانی‌های «معیارهای کیفیت»
Chrome 86 تغییراتی را در «معیارهای کیفیت فعالیت وب مطمئن» معرفی کرد که به‌طور کامل در تغییرات معیارهای کیفیت برای «برنامه‌های وب پیش‌رو» بااستفاده از «فعالیت وب مطمئن» توضیح داده شده است.
خلاصه سریع این است که باید مطمئن شوید برنامه‌هایتان سناریوهای زیر را مدیریت می‌کنند تا از خراب شدن آن‌ها جلوگیری شود:
- درستی‌سنجی نشدن پیوندهای دارایی دیجیتال هنگام راه‌اندازی برنامه
- عدم بازگشت HTTP 200 برای درخواست منبع شبکه آفلاین
- برگشت خطای HTTP 404 یا 5xx در برنامه.
علاوه‌بر اطمینان از اینکه برنامه اعتبارسنجی پیوندهای دارایی دیجیتال را با موفقیت پشت سر می‌گذارد، سناریوهای باقی‌مانده را می‌توان توسط یک کارگر سرویس مدیریت کرد:
self.addEventListener('fetch', event => {
event.respondWith((async () => {
try {
return await fetchAndHandleError(event.request);
} catch {
// Failed to load from the network. User is offline or the response
// has a status code that triggers the Quality Criteria.
// Try loading from cache.
const cachedResponse = await caches.match(event.request);
if (cachedResponse) {
return cachedResponse;
}
// Response was not found on the cache. Send the error / offline
// page. OFFLINE_PAGE should be pre-cached when the service worker
// is activated.
return await caches.match(OFFLINE_PAGE);
}
})());
});
async function fetchAndHandleError(request) {
const cache = await caches.open(RUNTIME_CACHE);
const response = await fetch(request);
// Throw an error if the response returns one of the status
// that trigger the Quality Criteria.
if (response.status === 404 ||
response.status >= 500 && response.status < 600) {
throw new Error(`Server responded with status: ${response.status}`);
}
// Cache the response if the request is successful.
cache.put(request, response.clone());
return response;
}
Workbox روال‌های مطلوب را در خود جای داده است و هنگام استفاده از عامل‌های خدماتی، کدهای تکراری را حذف می‌کند. یا اینکه می‌توانید از افزونه Workbox برای مدیریت این سناریوها استفاده کنید:
export class FallbackOnErrorPlugin {
constructor(offlineFallbackUrl, notFoundFallbackUrl, serverErrorFallbackUrl) {
this.notFoundFallbackUrl = notFoundFallbackUrl;
this.offlineFallbackUrl = offlineFallbackUrl;
this.serverErrorFallbackUrl = serverErrorFallbackUrl;
}
checkTrustedWebActivityCrash(response) {
if (response.status === 404 || response.status >= 500 && response.status <= 600) {
const type = response.status === 404 ? 'E_NOT_FOUND' : 'E_SERVER_ERROR';
const error = new Error(`Invalid response status (${response.status})`);
error.type = type;
throw error;
}
}
// This is called whenever there's a network response,
// but we want special behavior for 404 and 5**.
fetchDidSucceed({response}) {
// Cause a crash if this is a Trusted Web Activity crash.
this.checkTrustedWebActivityCrash(response);
// If it's a good response, it can be used as-is.
return response;
}
// This callback is new in Workbox v6, and is triggered whenever
// an error (including a NetworkError) is thrown when a handler runs.
handlerDidError(details) {
let fallbackURL;
switch (details.error.details.error.type) {
case 'E_NOT_FOUND': fallbackURL = this.notFoundFallbackUrl; break;
case 'E_SERVER_ERROR': fallbackURL = this.serverErrorFallbackUrl; break;
default: fallbackURL = this.offlineFallbackUrl;
}
return caches.match(fallbackURL, {
// Use ignoreSearch as a shortcut to work with precached URLs
// that have _WB_REVISION parameters.
ignoreSearch: true,
});
}
}