פעילויות אינטרנט מהימנות ממקורות מרובים

André Cipriani Bandarra

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

ניווט ב-ff-origin

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

כשמשתמש מנווט אל מחוץ למקור שאומת, מוצג ממשק המשתמש של הכרטיסייה בהתאמה אישית. סרגל כתובות האתרים בעמודה 'בהתאמה אישית' Tab מציין למשתמשים שעכשיו הם מנווטים בדומיין מחוץ לאפליקציה, ובמקביל לספק למשתמש לחצן X שמאפשר לו לחזור במהירות למקור שאומת.

אבל לעיתים קרובות אפליקציות אינטרנט יוצרות חוויות ממגוון מקורות - לדוגמה האפליקציה תהיה אפליקציית שופינג עם החוויה העיקרית ב-www.example.com, ואילו שלב התשלום בקופה מתארח ב-checkout.example.com.

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

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

הגדרת אימות לכמה מקורות

כמו במקור הראשי, האימות מתבצע באמצעות Digital Asset Links וכל דומיין שרוצים כדי לאמת את החשבון, צריך להיות קובץ assetlinks.json משלו.

בדוגמה שלנו עם www.example.com ו-checkout.example.com, נקבל:

  • https://www.example.com/.well-known/assetlinks.json
  • https://checkout.example.com/.well-known/assetlinks.json

כל דומיין מקושר לאותה אפליקציה Android, לכן קובצי assetlinks.json נראות בדיוק אותו הדבר.

בהנחה ששם החבילה של האפליקציה ל-Android הוא com.example.twa, גם assetlink.json יכילו קובץ שדומה לזה:

[{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target": {
  "namespace": "android_app",
  "package_name": "com.example",
   "sha256_cert_fingerprints": ["..."]}
}]

הוספת מקורות מרובים לאפליקציה ל-Android

באפליקציה ל-Android, צריך לעדכן את ההצהרה asset_statements כדי שתכלול את כל מקורות שצריך לאמת:

<string name="asset_statements">
[{
    \"relation\": [\"delegate_permission/common.handle_all_urls\"],
    \"target\": {
        \"namespace\": \"web\",
        \"site\": \"https://www.example.com\"
    }
}],
[{
    \"relation\": [\"delegate_permission/common.handle_all_urls\"],
    \"target\": {
        \"namespace\": \"web\",
        \"site\": \"https://checkout.example.com\"
    }
}],
</string>

הוספת מקורות נוספים לפעילות של מרכז האפליקציות

שימוש בברירת המחדל של מרכז האפליקציות

LauncherActivity שהוא חלק מספריית התמיכה של android-browser-helper הוספת כמה מקורות לאימות על ידי הגדרת פרויקט Android.

קודם כול צריך להוסיף רכיב string-array לקובץ res/values/strings.xml. כל כתובת URL נוספת צריכה יופיעו בתוך רכיב משנה item:

...
<string-array name="additional_trusted_origins">
    <item>https://www.google.com</item>
</string-array>
...

בשלב הבא צריך להוסיף תג meta-data חדש בתוך רכיב הפעילות הקיים שמפנה אל LauncherActivity, בתוך AndroidManifest.xml:

...
<activity android:name="com.google.androidbrowserhelper.trusted.LauncherActivity"
    android:label="@string/app_name">


    <meta-data
        android:name="android.support.customtabs.trusted.ADDITIONAL_TRUSTED_ORIGINS"
        android:resource="@array/additional_trusted_origins" />


    ...
</activity>
...

שימוש בפעילות מותאמת אישית של מרכז האפליקציות

כשמשתמשים בקוד מותאם אישית כדי להפעיל פעילות מהימנה באינטרנט, אפשר להוסיף מקורות נוספים באמצעות קריאה ל-setAdditionalTrustedOrigins כשמפתחים את ה-Intent להפעלת הפעילות המהימנה באינטרנט:

public void launcherWithMultipleOrigins(View view) {
  List<String> origins = Arrays.asList(
      "https://checkout.example.com/"
  );


  TrustedWebActivityIntentBuilder builder = new TrustedWebActivityIntentBuilder(LAUNCH_URI)
      .setAdditionalTrustedOrigins(origins);


  new TwaLauncher(this).launch(builder, null, null);
}

סיכום

לאחר ביצוע השלבים האלה, הפעילות באינטרנט המהימנה מוכנה עכשיו לתמוך בכמה מקורות. ל-android-browser-helper יש אפליקציה לדוגמה לפעילויות מהימנות באינטרנט עם כמה מקורות. יצרן חשוב לבדוק את זה.

פתרון בעיות

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

המדריך למתחילים של הפעילות באינטרנט בצורה מהימנה כולל קטע נהדר לפתרון בעיות שמסביר לנפות באגים בבעיות שקשורות ל-Digital Asset Link.

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