שיפור אבטחת התוסף

שיפור האבטחה ב-Manifest V3

זהו הקטע האחרון מתוך שלושה קטעים שמתארים שינויים שצריך לבצע בקוד שלא נכלל ב-service worker של התוסף. במאמר מתוארים השינויים הנדרשים לשיפור האבטחה של התוספים. בשני הקטעים האחרים מוסבר על עדכון הקוד הנדרש לשדרוג ל-Manifest V3 ועל החלפת בקשות חסימה באינטרנט.

הסרה של הרצה של מחרוזות שרירותיות

אי אפשר יותר להריץ לוגיקה חיצונית באמצעות executeScript(),‏ eval() ו-new Function().

  • מעבירים את כל הקוד החיצוני (JS, ‏ Wasm, ‏ CSS) לחבילת התוסף.
  • מעדכנים את ההפניות לסקריפטים ולסגנונות כדי לטעון משאבים מחבילת התוספים.
  • שימוש ב-chrome.runtime.getURL() כדי ליצור כתובות URL של משאבים בזמן הריצה.
  • שימוש ב-iframe בתוך ארגז חול: עדיין יש תמיכה ב-eval וב-new Function(...) במסגרות iframe בתוך ארגז חול. פרטים נוספים זמינים במדריך בנושא iframes ב-sandbox.

השיטה executeScript() נמצאת עכשיו במרחב השמות scripting ולא במרחב השמות tabs. מידע על עדכון קריאות זמין במאמר העברת executeScript().

יש כמה מקרים מיוחדים שבהם עדיין אפשר להריץ מחרוזות שרירותיות:

הסרת קוד שמתארח מרחוק

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

  • קובצי JavaScript שנשלפו מהשרת של המפתח.
  • כל ספרייה שמתארחת ב-CDN.
  • ספריות של צד שלישי בחבילה שמאחזרות באופן דינמי קוד שמתארח מרחוק.

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

תכונות ולוגיקה מבוססות-הגדרה

התוסף טוען תצורה מרוחקת (למשל קובץ JSON) ומאחסן אותה במטמון בזמן הריצה. התצורה שנשמרה במטמון קובעת אילו תכונות מופעלות.

לוגיקה חיצונית באמצעות שירות מרוחק

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

הטמעת קוד שמתארח מרחוק ב-iframe בארגז חול (sandbox)

יש תמיכה בקוד שמתארח מרחוק ברכיבי iframe ב-sandbox. חשוב לזכור שהגישה הזו לא עובדת אם הקוד דורש גישה ל-DOM של דף ההטמעה.

איך מחברים ספריות של צד שלישי לחבילה

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

<script src="./react-dom.production.min.js"></script>
<link href="./bootstrap.min.css" rel="stylesheet">

כדי לכלול ספרייה ב-service worker, מגדירים את המפתח "background.type" ל-"module" במניפסט ומשתמשים בהצהרה import.

שימוש בספריות חיצוניות בסקריפטים שהוחדרו בכרטיסיות

אפשר גם לטעון ספריות חיצוניות בזמן הריצה על ידי הוספה שלהן למערך files בזמן הקריאה ל-scripting.executeScript(). עדיין אפשר לטעון נתונים מרחוק בזמן הריצה.

chrome.scripting.executeScript({
  target: {tabId: tab.id},
  files: ['jquery-min.js', 'content-script.js']
});

הזרקת פונקציה

אם אתם צריכים יותר דינמיות, המאפיין החדש func ב-scripting.executeScript() מאפשר להחדיר פונקציה כסקריפט תוכן ולהעביר משתנים באמצעות המאפיין args.

Manifest V2
let name = 'World!';
chrome.tabs.executeScript({
  code: `alert('Hello, ${name}!')`
});

בקובץ סקריפט ברקע.

מניפסט V3
async function getCurrentTab() {/* ... */}
let tab = await getCurrentTab();

function showAlert(givenName) {
  alert(`Hello, ${givenName}`);
}

let name = 'World';
chrome.scripting.executeScript({
  target: {tabId: tab.id},
  func: showAlert,
  args: [name],
});

ברקע של ה-service worker.

המאגר של דוגמאות לתוספים ל-Chrome מכיל דוגמה להזרקת פונקציות שאפשר לעבור עליה שלב אחרי שלב. דוגמה ל-getCurrentTab() מופיעה בחומר העזר של הפונקציה הזו.

חיפוש פתרונות חלופיים אחרים

אם הגישות הקודמות לא עוזרות בתרחישים לדוגמה שלכם, יכול להיות שתצטרכו למצוא פתרון חלופי (למשל, לעבור לספרייה אחרת) או למצוא דרכים אחרות להשתמש בפונקציונליות של הספרייה. לדוגמה, במקרה של Google Analytics, אפשר לעבור ל-Measurement Protocol של Google במקום להשתמש בגרסה הרשמית של JavaScript שמתארח מרחוק, כפי שמתואר במדריך שלנו ל-Google Analytics 4.

עדכון מדיניות האבטחה של התוכן

השדה "content_security_policy" לא הוסר מהקובץ manifest.json, אבל הוא עכשיו מילון שתומך בשני מאפיינים: "extension_pages" ו-"sandbox".

Manifest V2
{
  ...
  "content_security_policy": "default-src 'self'"
  ...
}
מניפסט V3
{
  ...
  "content_security_policy": {
    "extension_pages": "default-src 'self'",
    "sandbox": "..."
  }
  ...
}

extension_pages: מתייחס להקשרים בתוסף, כולל קובצי HTML ושירותי עבודה.

sandbox: מתייחס לכל דפי התוסף שנמצאים בארגז חול שבהם התוסף משתמש.

הסרת מדיניות אבטחת תוכן שלא נתמכת

במניפסט V3 אסור להשתמש בערכים מסוימים של מדיניות אבטחת תוכן בשדה "extension_pages", שהיו מותרים במניפסט V2. באופן ספציפי, מניפסט V3 אוסר על אלה שמאפשרים ביצוע קוד מרחוק. ההנחיות script-src,, object-src ו-worker-src יכולות לקבל רק את הערכים הבאים:

  • self
  • none
  • wasm-unsafe-eval
  • תוספים לא מוצקים בלבד: כל מקור של localhost‏ (http://localhost,‏ http://127.0.0.1 או כל יציאה בדומיינים האלה)

לערכים של מדיניות אבטחת התוכן עבור sandbox אין הגבלות חדשות כאלה.