שימוש ב-PWA באפליקציה ל-Android

הפעלה של PWA באפליקציה ל-Android

Progressive Web Apps (PWA) הן אפליקציות אינטרנט שמשתמשות בתכונות שדומות לאפליקציה כדי ליצור חוויות משתמש באיכות גבוהה, מהירות, אמינות ומושכות.

לאינטרנט יש טווח הגעה מדהים והוא מציע למשתמשים דרכים מתקדמות לגלות חוויות חדשות. אבל המשתמשים רגילים גם לחפש אפליקציות בחנות של מערכת ההפעלה שלהם. במקרים רבים המשתמשים האלה כבר מכירים את המותג או השירות שהם מחפשים, ויש להם רמה גבוהה של כוונת רכישה, שמובילה למדדי מעורבות גבוהים מהממוצע.

חנות Play היא חנות לאפליקציות ל-Android, ובדרך כלל מפתחים רוצים לפתוח את Progressive Web Apps מתוך האפליקציות שלהם ל-Android.

'פעילות באינטרנט מהימנה' הוא תקן פתוח שמאפשר לדפדפנים לספק קונטיינר שתואם לפלטפורמת האינטרנט באופן מלא, שמעבד אפליקציות PWA בתוך אפליקציה ל-Android. התכונה זמינה ב-Chrome ואפשר להשתמש בה בפיתוח ב-Firefox Nightly.

הפתרונות הקיימים היו מוגבלים

תמיד היה אפשר לכלול חוויות אינטרנט באפליקציה ל-Android באמצעות טכנולוגיות כמו Android WebView או frameworks כמו Cordova.

המגבלה ב-Android WebView היא שהוא לא מיועד לשמש כתחליף לדפדפן. ה-WebView של Android הוא כלי למפתחים לשימוש בממשק המשתמש באינטרנט באפליקציות ל-Android, והוא לא מספק גישה מלאה לתכונות של פלטפורמת האינטרנט המודרנית, כמו הכלי לבחירת אנשי קשר או מערכת קבצים, בין היתר.

קורדובה תוכננה להרחיב את החסרונות של WebView, אבל ממשקי ה-API מוגבלים לסביבת Cordova. המשמעות היא שצריך לתחזק בסיס קוד נוסף לשימוש בממשקי Cordova API לאפליקציה ל-Android, בנפרד מ-PWA באינטרנט הפתוח.

בנוסף, בדרך כלל יכולת הגילוי של תכונות לא תמיד פועלת כמצופה, וגם בעיות תאימות בין גרסאות Android ליצרני ציוד מקורי יכולות להיות בעיה. כאשר המפתחים משתמשים באחד מהפתרונות האלה, הם זקוקים לתהליכי הבטחת איכות נוספים, ונדרשת עלות פיתוח נוספת כדי לזהות וליצור פתרונות עקיפים.

ההגדרה 'פעילות באינטרנט' היא מאגר חדש לאפליקציות אינטרנט ב-Android

מפתחים יכולים עכשיו להשתמש בפעילות באינטרנט מהימנה כמאגר, כדי לכלול PWA כפעילות הפעלה של אפליקציה ל-Android. הטכנולוגיה הזאת משתמשת בדפדפן כדי להציג את ה-PWA במסך מלא, וכך להבטיח שבפעילות האינטרנט המהימנה יש תאימות זהה לתכונות של פלטפורמת האינטרנט ולממשקי ה-API של הדפדפן הבסיסי. יש גם כלים בקוד פתוח שנועדו להקל על ההטמעה של אפליקציה ל-Android באמצעות פעילות מהימנה באינטרנט.

יתרון נוסף שלא זמין בפתרונות אחרים הוא שהמאגר משתף את האחסון עם הדפדפן. מצבי ההתחברות והעדפות המשתמשים משותפים בצורה חלקה בין חוויות המשתמש.

תאימות לדפדפנים

התכונה הזו זמינה ב-Chrome מגרסה 75, ו-Firefox מטמיע אותה בגרסה ללילה.

קריטריוני איכות

מפתחי אתרים צריכים להשתמש ב'פעילות אינטרנט מהימנה' כשהם רוצים לכלול תוכן מהאינטרנט באפליקציה ל-Android.

תוכן אינטרנט בפעילות אינטרנט מהימנה חייב לעמוד בקריטריונים של יכולת התקנה של PWA.

בנוסף, על מנת להתאים את ההתנהגות שהמשתמשים מצפים לה מאפליקציות ל-Android, השקנו ב-Chrome 86 שינוי שבמסגרתו אי-טיפול בתרחישים הבאים נחשב לקריסה:

  • האימות של הקישורים לנכסים הדיגיטליים נכשל במהלך השקת האפליקציה.
  • הפונקציה לא מחזירה את הערך HTTP 200 של בקשה למשאב רשת אופליין.
  • בקשת ניווט שמחזירה שגיאת HTTP 404 או 5xx.

כשאחד מהתרחישים האלה מתרחש ב'פעילות באינטרנט' מהימנה, הוא גורם לקריסה גלויה למשתמש של האפליקציה ל-Android. מומלץ לקרוא את ההנחיות לגבי טיפול בתרחישים האלה ב-service worker.

האפליקציה צריכה לעמוד גם בקריטריונים נוספים ספציפיים ל-Android, כמו תאימות למדיניות.

צילום מסך שבו מוצג הניקוד של AirHorn מ-Lighthouse, עם תג PWA וציון ביצועים של 100.
תג ה-PWA ב-Lighthouse מציין אם ה-PWA עומדת בקריטריונים של יכולת ההתקנה.

כלים

מפתחי אתרים שרוצים להשתמש בפעילות המהימנה באינטרנט לא צריכים ללמוד טכנולוגיות או ממשקי API חדשים כדי להפוך את ה-PWA שלהם לאפליקציה ל-Android. יחד, חבילת בועות ו-PWABuilder מספקת כלים למפתחים בצורת ספרייה, ממשק שורת פקודה (CLI) וממשק משתמש גרפי (GUI).

ניילון בועות

הפרויקט בועות יוצר אפליקציות ל-Android בצורת ספריית NodeJS וממשק שורת פקודה (CLI).

כדי להפעיל מחדש פרויקט חדש צריך להפעיל את הכלי ולהעביר את כתובת ה-URL של מניפסט האינטרנט:

npx @bubblewrap/cli init --manifest=https://pwa-directory.appspot.com/manifest.json

הכלי גם יכול ליצור את הפרויקט, והפעלת הפקודה למטה תיצור פלט של אפליקציית Android שמוכנה להעלאה לחנות Play:

npx @bubblewrap/cli build

אחרי הרצת הפקודה הזו, קובץ בשם app-release-signed.apk יהיה זמין בספריית השורש של הפרויקט. זה הקובץ שיועלה לחנות Play.

PWABuilder

בעזרת PWABuilder מפתחים יכולים להפוך אתרים קיימים ל-Progressive Web Apps. היא גם משתלבת עם בועות כדי לספק ממשק GUI שמאפשר לשלב את אפליקציות ה-PWA האלה לאפליקציה ל-Android. צוות PWABuilder כתב פוסט נהדר בבלוג על האופן שבו יוצרים אפליקציה ל-Android באמצעות הכלי.

אימות הבעלות על ה-PWA באפליקציה ל-Android

מפתח שיוצר Progressive Web App מעולה לא ירצה שמפתח אחר יבנה איתה אפליקציה ל-Android בלי רשותו. כדי שזה לא יקרה, צריך להתאים את האפליקציה ל-Android ל-Progressive Web App באמצעות כלי שנקרא Digital Asset Links (קישורים לנכס דיגיטלי).

בועות בועות ו-PWABuilder דואגות להגדרות הנדרשות של האפליקציה ל-Android, אבל נותר עוד שלב אחד – הוספת הקובץ assetlinks.json ל-PWA.

כדי ליצור את הקובץ הזה, מפתחים צריכים את חתימת SHA-256 של המפתח המשמש לחתימה על ה-APK שהמשתמשים מורידים.

אפשר ליצור את המפתח בכמה דרכים, והדרך הקלה ביותר למצוא את המפתח שחותם על ה-APK שנשלח למשתמשי הקצה היא להוריד אותו מחנות Play עצמה.

כדי למנוע הצגה של אפליקציה לא תקינה למשתמשים, כדאי לפרוס את האפליקציה בערוץ בדיקה סגור, להתקין אותה במכשיר בדיקה ואז להשתמש ב-Peter's Asset Link Tool כדי ליצור את קובץ assetlinks.json הנכון לאפליקציה. צריך להפוך את קובץ assetlinks.json שנוצר לזמין ב-/.well-known/assetlinks.json, בדומיין שאומת.

השלבים הבאים

Progressive Web App היא חוויית אינטרנט באיכות גבוהה. הפעילות המהימנה באינטרנט היא דרך חדשה לפתוח את החוויות האיכותיות האלה מהאפליקציה ל-Android כשהן עומדות בקריטריונים המינימליים לאיכות.

אם אתם מתחילים להשתמש ב-Progressive Web Apps, מומלץ לקרוא את ההנחיות שלנו ליצירת PWA מעולה. מפתחים שכבר יש להם PWA יכולים להשתמש ב-Lighthouse כדי לבדוק אם היא עומדת בקריטריוני האיכות.

לאחר מכן, משתמשים ב-בועה או ב-PWABuilder כדי ליצור את האפליקציה ל-Android, מעלים את האפליקציה לערוץ בדיקה סגור בחנות Play ומתאימים אותה ל-PWA באמצעות Peter's Asset Link Tool.

לסיום, צריך להעביר את האפליקציה מערוץ הבדיקה הסגור לסביבת הייצור.