הגדרת פעילויות אינטרנט מהימנות יכולה להיות מעט מורכבת, במיוחד אם כל מה שאתם רוצים לעשות הוא להציג את האתר שלכם. במדריך הזה נסביר איך יוצרים פרויקט בסיסי שמשתמש בפעילויות אינטרנט מהימנות, ונציג את כל הדברים שחשוב לדעת.
בסיום המדריך הזה, תוכלו:
- השתמשתם ב-Bubblewrap כדי ליצור אפליקציה שמשתמשת בפעילות מהימנה באינטרנט ועוברת את האימות.
- מתי משתמשים במפתחות החתימה שלכם
- לקבוע את החתימה שבה נוצרה אפליקציית Android.
- לדעת איך יוצרים קובץ בסיסי של קישורים לנכסים דיגיטליים.
כדי לפעול לפי המדריך הזה, צריך:
- Node.js מגרסה 10 ואילך מותקן במחשב הפיתוח.
- טלפון Android או אמולטור שמחוברים ומוכנים לפיתוח (מפעילים את ניפוי הבאגים ב-USB אם משתמשים בטלפון פיזי).
- דפדפן שתומך בפעילות Trusted Web בטלפון הפיתוח. גרסת Chrome 72 ואילך תעבוד. בקרוב נוסיף תמיכה בדפדפנים נוספים.
- אתר שרוצים להציג ב'פעילות Trusted Web'.
פעילות אינטרנט מהימנה מאפשרת לאפליקציה ל-Android להפעיל כרטיסיית דפדפן במסך מלא בלי ממשק משתמש של דפדפן. היכולת הזו מוגבלת לאתרים שבבעלותכם, ותוכלו להוכיח זאת על ידי הגדרת קישורי נכסים דיגיטליים. נרחיב עליהם בהמשך.
כשמפעילים פעילות באינטרנט מהימנה, הדפדפן בודק את התוצאה של בדיקת קישורי הנכסים הדיגיטליים. התהליך הזה נקרא אימות. אם האימות ייכשל, הדפדפן יחזור להציג את האתר ככרטיסייה מותאמת אישית.
התקנה והגדרה של Bubblewrap
Bubblewrap הוא קבוצה של ספריות וכלי שורת פקודה (CLI) ל-Node.js שעוזר למפתחים ליצור, לפתח ולהריץ אפליקציות אינטרנט מתקדמות (PWA) בתוך אפליקציות ל-Android, באמצעות Trusted Web Activity.
אפשר להתקין את ה-CLI באמצעות הפקודה הבאה:
npm i -g @bubblewrap/cli
הגדרת הסביבה
כשמריצים את Bubblewrap בפעם הראשונה, המערכת מציעה להוריד ולהתקין באופן אוטומטי את יחסי התלות החיצוניים הנדרשים. מומלץ לאפשר לכלי לעשות זאת, כי כך מובטח שהיחסי התלות מוגדרים בצורה נכונה. במסמכי התיעוד של Bubblewrap מוסבר איך להשתמש בהתקנה קיימת של JDK (ערכת פיתוח Java) או של כלים של 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 הוא ממשק משתמש גרפי שמשתמש בספרייה Bubblewrap כדי ליצור פרויקטים של פעילות מהימנה באינטרנט. בפוסט הזה בבלוג מפורטות הוראות נוספות לשימוש ב-PWA Builder ליצירת אפליקציית Android שפותחת את ה-PWA.
הערה לגבי מפתחות חתימה
ב-Digital Asset Links נלקח בחשבון המפתח שבו חתומה חבילת ה-APK, וגורם נפוץ לכישלון האימות הוא שימוש בחתימה שגויה. (חשוב לזכור: אם האימות נכשל, האתר יופעל ככרטיסייה בהתאמה אישית עם ממשק משתמש של דפדפן בחלק העליון של הדף). כש-Bubblewrap יוצר את האפליקציה, נוצר קובץ APK עם הגדרת מפתח בשלב init. עם זאת, כשתפרסמו את האפליקציה ב-Google Play, יכול להיות שייווצר עבורכם מפתח אחר, בהתאם לאופן שבו תבחרו לטפל במפתחות החתימה. מידע נוסף על מפתחות חתימה והקשר שלהם ל-Bubblewrap ול-Google Play
הגדרת קובץ הקישור לנכס
קישורי Digital Asset Links מורכבים בעיקר מקובץ באתר שמפנה לאפליקציה וממטא-נתונים מסוימים באפליקציה שמפנים לאתר.
אחרי שיוצרים את הקובץ 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.