אפשר לאפליקציות אינטרנט מותקנות להיות handlers של קבצים

רישום אפליקציה כ-handler של קבצים במערכת ההפעלה.

Thomas Steiner

עכשיו, כשאפליקציות אינטרנט יכולות לקרוא ולכתוב קבצים, השלב ההגיוני הבא הוא לאפשר למפתחים להצהיר על אפליקציות האינטרנט האלה כרכיבי handler של קבצים שהאפליקציות שלהם יכולות ליצור ולעבד. אפשר לעשות את זה בדיוק עם File Treatment API. אחרי שמירת אפליקציית עריכת טקסט כמנהלת קבצים ואישור ההתקנה, אפשר ללחוץ לחיצה ימנית על קובץ .txt ב-macOS ולבחור באפשרות 'קבלת מידע' כדי להורות למערכת ההפעלה תמיד לפתוח קובצי .txt באמצעות האפליקציה הזו כברירת מחדל.

תרחישים לדוגמה לשימוש ב-File Handling API

דוגמאות לאתרים שעשויים להשתמש ב-API הזה:

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

איך משתמשים ב-File Handling API

שיפור הדרגתי

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

• Web Share Target API מאפשר למפתחים לציין את האפליקציה שלהם כיעד שיתוף, כדי שאפשר יהיה לפתוח קבצים מהגיליון לשיתוף של מערכת ההפעלה.
• אפשר לשלב את File System Access API עם גרירה ושחרור של קבצים, כדי שמפתחים יוכלו לטפל בקבצים שהושלכו באפליקציה שכבר פתוחה.

תמיכה בדפדפנים

זיהוי תכונות

כדי לבדוק אם יש תמיכה ב-File Handling API, משתמשים ב-:

if ('launchQueue' in window && 'files' in LaunchParams.prototype) {
  // The File Handling API is supported.
}

החלק הדקלרטיבי של ה-File Handling API

בשלב הראשון, אפליקציות אינטרנט צריכות לתאר באופן דקלרטיבי במניפסט של אפליקציית האינטרנט את סוגי הקבצים שהן יכולות לטפל בהם. ‏File Handling API מרחיב את המניפסט של אפליקציית האינטרנט באמצעות מאפיין חדש בשם "file_handlers" שמקבל מערך של מנהלי קבצים. בורר קובץ הוא אובייקט עם המאפיינים הבאים:

• מאפיין "action" שמצביע על כתובת URL בהיקף האפליקציה כערך שלו.
• מאפיין "accept" עם אובייקט מסוג MIME כמפתחות ורשימות של סיומות קבצים כערכים.
• נכס "icons" עם מערך של סמלי ImageResource. במערכות הפעלה מסוימות, כשמשייכים סוג קובץ, מוצג סמל שהוא לא רק סמל האפליקציה המשויכת, אלא סמל מיוחד שקשור לשימוש בסוג הקובץ הזה באפליקציה.
• מאפיין "launch_type" שמגדיר אם יש לפתוח כמה קבצים בלקוח אחד או בכמה לקוחות. ערך ברירת המחדל הוא "single-client". אם המשתמש פותח כמה קבצים, ואם הוספה הערה למטפל בקובץ עם "multiple-clients" בתור "launch_type" שלו, תתבצע יותר מהפעלה אחת של האפליקציה, וכל פעולה תכלול רק רכיב אחד במערך LaunchParams.files (בהמשך).

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

{
  "file_handlers": [
    {
      "action": "/open-csv",
      "accept": {
        "text/csv": [".csv"]
      },
      "icons": [
        {
          "src": "csv-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "single-client"
    },
    {
      "action": "/open-svg",
      "accept": {
        "image/svg+xml": ".svg"
      },
      "icons": [
        {
          "src": "svg-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "single-client"
    },
    {
      "action": "/open-graf",
      "accept": {
        "application/vnd.grafr.graph": [".grafr", ".graf"],
        "application/vnd.alternative-graph-app.graph": ".graph"
      },
      "icons": [
        {
          "src": "graf-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "multiple-clients"
    }
  ]
}

הדוגמה הזו מיועדת לאפליקציה היפותטית שמטפלת בקבצים של ערכים מופרדים בפסיקים (.csv) ב-/open-csv, בקבצים של גרפיקה וקטורית שניתן להתאים אותם (.svg) ב-/open-svg ובפורמט קובץ Grafr מלאכותי עם התוסף .grafr, ‏.graf או .graph ב-/open-graf. שני הקבצים הראשונים ייפתחו בלקוח יחיד, והקובץ האחרון ייפתח בכמה לקוחות אם יטופלו כמה קבצים.

החלק החשוב ב-File Treatment API

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

if ('launchQueue' in window && 'files' in LaunchParams.prototype) {
  launchQueue.setConsumer((launchParams) => {
    // Nothing to do when the queue is empty.
    if (!launchParams.files.length) {
      return;
    }
    for (const fileHandle of launchParams.files) {
      // Handle the file.
    }
  });
}

תמיכה ב-DevTools

נכון לזמן כתיבת המאמר, אין תמיכה ב-DevTools, אבל שלחתי בקשה להוספת תכונה כדי להוסיף תמיכה.

הדגמה (דמו)

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

אבטחה

צוות Chrome תכנן והטמיע את File Handling API בהתאם לעקרונות המרכזיים שמוגדרים במאמר בקרת הגישה לתכונות עוצמתיות של פלטפורמת אינטרנט, כולל בקרת משתמשים, שקיפות וארגונומיה.

הרשאות, שמירה על עקביות ההרשאות ועדכונים בקשר ל-handler של קבצים

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

ההרשאה הזו מוצגת בכל פעם שהמשתמש לוחץ על אישור או חסימה של הטיפול בקבצים באתר, או עד שהוא מתעלם מההנחיה שלוש פעמים (ואחר כך Chromium יוטל אמברגו יחסום את ההרשאה הזו). ההגדרה שנבחרה תישאר ללא שינוי בסגירה ובפתיחה מחדש של PWA.

כשהמניפסט מתעדכן וזוהים שינויים בקטע "file_handlers", ההרשאות מתאפסות.

אתגרים שקשורים לקבצים

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

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

אתגרים של טיפול באירועים בברירת מחדל

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

שליטת משתמשים

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

שקיפות

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

משוב

צוות Chrome רוצה לשמוע על החוויה שלכם עם ממשק ה-API לטיפול בקבצים.

תיאור של עיצוב ה-API

האם יש משהו ב-API שלא פועל כצפוי? או אולי חסרות שיטות או מאפיינים שאתם צריכים כדי להטמיע את הרעיון? יש לכם שאלות או הערות לגבי מודל האבטחה?

• אפשר לשלוח דיווח על בעיה במפרט במאגר GitHub המתאים, או להוסיף את המחשבות שלכם לבעיה קיימת.

דיווח על בעיה בהטמעה

מצאתם באג בהטמעה של Chrome? או שההטמעה שונה מהמפרט?

• שולחים דיווח על באג בכתובת new.crbug.com. חשוב לכלול כמה שיותר פרטים, הוראות פשוטות לשחזור הבעיה ולהזין UI>Browser>WebAppInstalls>FileHandling בתיבה Components. Glitch הוא כלי מצוין לשיתוף שחזור מהיר וקל של באגים.

הצגת תמיכה ב-API

מתכננים להשתמש ב-File Handling API? התמיכה הציבורית שלכם עוזרת לצוות Chrome לתת עדיפות לתכונות, ומראה לספקי דפדפנים אחרים כמה חשובה התמיכה בהן.

• אתם יכולים לספר איך אתם מתכננים להשתמש בו בשרשור ב-Discourse של WICG.
• שלחו ציוץ אל @ChromiumDev בעזרת ה-hashtag #FileHandling, והראו לנו איפה ואיך אתם משתמשים בו.

קישורים שימושיים

• הודעת הסבר ציבורית
• הדגמה של File Handling API | מקור ההדגמה של File Handling API
• באג במעקב ב-Chromium
• רשומה של ChromeStatus.com
• רכיב Blink: UI>Browser>WebAppInstalls>FileHandling
• בדיקת תגים
• עמדת Mozilla בנושא תקנים

תודות

ה-File Handling API צוין על ידי Eric Willigers,‏ Jay Harris ו-Raymes Khoury. המאמר הזה נבדק על ידי Joe Medley.