הגדרת פעילויות אינטרנט מהימנות יכולה להיות מעט מורכבת, במיוחד אם כל מה שאתם רוצים לעשות הוא להציג את האתר שלכם. במדריך הזה מוסבר איך ליצור פרויקט בסיסי שכולל את כל האפליקציות המהימנות באינטרנט.
בסיום המדריך הזה, תוכלו:
- השתמשתם ב-Bubblewrap כדי ליצור אפליקציה שמשתמשת בפעילות מהימנה באינטרנט ועוברת את האימות.
- מתי משתמשים במפתחות החתימה
- יכולת לקבוע את החתימה שאיתה בונים אפליקציית Android.
- לדעת איך יוצרים קובץ בסיסי של קישורים לנכסים דיגיטליים.
כדי לפעול לפי המדריך הזה, צריך:
- Node.js מגרסה 10 ואילך מותקן במחשב הפיתוח.
- טלפון Android או אמולטור שמחוברים ומוכנים לפיתוח (מפעילים את ניפוי הבאגים ב-USB אם משתמשים בטלפון פיזי).
- דפדפן שתומך בפעילות Trusted Web בטלפון הפיתוח. Chrome מגרסה 72 ואילך יפעל. בקרוב נוסיף תמיכה בדפדפנים נוספים.
- אתר שברצונך להציג ב'פעילות אינטרנט מהימנה'.
ההגדרה 'פעילות באינטרנט מהימנה' מאפשרת לאפליקציה ל-Android להפעיל כרטיסיית דפדפן במסך מלא בלי ממשק משתמש של דפדפן. היכולת הזו מוגבלת לאתרים שבבעלותכם, ותוכלו להוכיח זאת על ידי הגדרת קישורי נכסים דיגיטליים. נעסוק בהם בהמשך.
כשמפעילים פעילות באינטרנט מהימנה, הדפדפן בודק את התוצאה של בדיקת קישורי הנכסים הדיגיטליים. התהליך הזה נקרא אימות. אם האימות ייכשל, הדפדפן יחזור להציג את האתר ככרטיסייה מותאמת אישית.
התקנה והגדרה של Bubblewrap
בועות היא קבוצה של ספריות וכלי שורת פקודה (CLI) ל-Node.js, שעוזרים למפתחים ליצור, לבנות ולהפעיל אפליקציות מסוג Progressive Web App בתוך אפליקציות ל-Android, באמצעות התכונה 'פעילות מהימנות באינטרנט'.
אפשר להתקין את ה-CLI באמצעות הפקודה הבאה:
npm i -g @bubblewrap/cli
הגדרת הסביבה
כשמריצים את Bubblewrap בפעם הראשונה, המערכת מציעה להוריד ולהתקין באופן אוטומטי את יחסי התלות החיצוניים הנדרשים. מומלץ לאפשר לכלי לעשות זאת, כי כך מובטח שהיחסי התלות מוגדרים בצורה נכונה. במסמכי התיעוד של Bubblewrap מוסבר איך להשתמש בהתקנה קיימת של ערכת הפיתוח של Java (JDK) או בכלים של Android בשורת הפקודה.
איך מפעילים ומפתחים את הפרויקט
כדי לאתחל פרויקט Android שעוטף את PWA, מריצים את הפקודה init:
bubblewrap init --manifest=https://my-twa.com/manifest.json
Bubblewrap יקרא את Web Manifest, יבקש מהמפתחים לאשר את הערכים שישמשו בפרויקט ל-Android ויצור את הפרויקט באמצעות הערכים האלה. אחרי יצירת הפרויקט, יוצרים קובץ APK באמצעות הפקודה:
bubblewrap build
ריצה
שלב ה-build ייצור קובץ בשם app-release-signed.apk. אפשר להתקין את הקובץ הזה במכשיר פיתוח לצורך בדיקה או להעלות אותו לחנות Play כדי להשיק אותו.
ב-Bubblewrap יש פקודה להתקנה ולבדיקה של האפליקציה במכשיר מקומי. מחברים את מכשיר הפיתוח למחשב ומריצים את הפקודה:
bubblewrap install
לחלופין, אפשר להשתמש בכלי adb.
adb install app-release-signed.apk
האפליקציה אמורה להיות זמינה עכשיו במרכז האפליקציות של המכשיר. כשתפתחו את האפליקציה, תבחינו שהאתר שלכם יופעל ככרטיסייה מותאמת אישית ולא כפעילות אינטרנט מהימנה. הסיבה לכך היא שעדיין לא הגדרנו את האימות של קישורי הנכסים הדיגיטליים, אבל קודם...
חלופות לממשק משתמש גרפי (GUI) ל-Bubblewrap
PWA Builder מספק ממשק GUI שמשתמש בספריית בועות כדי ליצור פרויקטים מהימנים באינטרנט. בפוסט בבלוג הזה מפורטות הוראות נוספות לשימוש ב-PWA Builder כדי ליצור אפליקציה ל-Android שפותחת את ה-PWA.
הערה לגבי חתימת מפתחות
ב-Digital Asset Links נלקח בחשבון המפתח שבו חתומה חבילת ה-APK, וגורם נפוץ לכישלון האימות הוא שימוש בחתימה שגויה. (חשוב לזכור: אם האימות נכשל, האתר יופעל ככרטיסייה בהתאמה אישית עם ממשק משתמש של דפדפן בחלק העליון של הדף). כש-Bubblewrap יוצר את האפליקציה, נוצר קובץ APK עם הגדרת מפתח בשלב init. עם זאת, כשתפרסמו את האפליקציה ב-Google Play, יכול להיות שייווצר עבורכם מפתח אחר, בהתאם לאופן שבו תבחרו לטפל במפתחות החתימה. מידע נוסף על מפתחות חתימה והקשר שלהם ל-Bubblewrap ול-Google Play
הגדרת קובץ הקישור לנכס
קישורים לנכסים דיגיטליים הם בעצם קובץ באתר שמפנה לאפליקציה וכמה מטא-נתונים באפליקציה שמפנה לאתר.
אחרי שיוצרים את הקובץ assetlinks.json, מעלים אותו לאתר בכתובת .well-known/assetlinks.json (ביחס לשורש) כדי שהדפדפן יוכל לאמת את האפליקציה בצורה תקינה. כדאי לעיין בסקירה מפורטת על קישורים לנכסים דיגיטליים כדי לקבל מידע נוסף על הקשר שלהם למפתח החתימה.
מתבצעת בדיקה של הדפדפן
פעילות Trusted Web תנסה לפעול בהתאם לדפדפן ברירת המחדל שבחר המשתמש. אם דפדפן ברירת המחדל של המשתמש תומך בפעילויות אינטרנט מהימנות, הוא יופעל. אם לא, אם יש דפדפן מותקן שתומך ב'פעילויות מהימנות באינטרנט', הוא יבחר. לבסוף, התנהגות ברירת המחדל היא לחזור למצב 'כרטיסיות מותאמות אישית'.
המשמעות היא שאם אתם מנסים לנפות באגים שקשורים לפעילויות מהימנות באינטרנט, עליכם לוודא שאתם משתמשים בדפדפן לדעתכם. אפשר להשתמש בפקודה הבאה כדי לבדוק באיזה דפדפן נעשה שימוש:
> adb logcat -v brief | grep -e TWAProviderPicker
D/TWAProviderPicker(17168): Found TWA provider, finishing search: com.google.android.apps.chrome
השלבים הבאים
אם פעלתם לפי המדריך הזה, סביר להניח שהתכונה 'פעילות באתרים מהימנים' פועלת ותהיה לכם מספיק ידע כדי לנפות באגים ולגלות מה קורה כשהאימות נכשל. אם לא, כדאי לעיין במושגים נוספים של Android למפתחי אינטרנט או לשלוח דיווח על בעיה ב-GitHub לגבי המסמכים האלה.
בשלבים הבאים, מומלץ להתחיל ביצירת סמל לאפליקציה. לאחר מכן, תוכלו לשקול לפרוס את האפליקציה בחנות Play.