המרות חתומות (SXG)

‫SXG הוא מנגנון להעברת נתונים שמאפשר לאמת את המקור של משאב, בלי קשר לאופן שבו הוא הועבר.

Katie Hempenius
Katie Hempenius
X
Devin Mullins
Devin Mullins
X GitHub

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

במאמר הזה מופיעה סקירה מקיפה על SXG: איך הוא פועל, תרחישים לדוגמה וכלים.

תאימות דפדפן

דפדפנים שמבוססים על Chromium תומכים ב-SXG (החל מהגרסאות הבאות: Chrome 73,‏ Edge 79 ו-Opera 64).

סקירה כללית

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

איך זה עובד

אתר חותם על צמד בקשה/תגובה ("חילופי HTTP") באופן שמאפשר לדפדפן לאמת את המקור והשלמות של התוכן, בלי קשר לאופן שבו התוכן הופץ. כתוצאה מכך, הדפדפן יכול להציג את כתובת ה-URL של אתר המקור בסרגל הכתובות, במקום את כתובת ה-URL של השרת שממנו נשלח התוכן.

תרשים שמסביר איך פועלים חילופי נתונים חתומים (SXG). הדפדפן מתקשר עם המטמון, שמתקשר עם אתר היעד

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

פורמט SXG

קובץ SXG הוא קובץ בקידוד בינארי שמכיל שני רכיבים עיקריים: HTTP exchange וחתימה שכוללת את ה-exchange. חילופי הנתונים ב-HTTP כוללים כתובת URL של בקשה, מידע על משא ומתן על תוכן ותגובת HTTP.

דוגמה לקובץ SXG מפוענח:

format version: 1b3
request:
  method: GET
  uri: https://example.org/
  headers:
response:
  status: 200
  headers:
    Cache-Control: max-age=604800
    Digest: mi-sha256-03=kcwVP6aOwYmA/j9JbUU0GbuiZdnjaBVB/1ag6miNUMY=
    Expires: Mon, 24 Aug 2020 16:08:24 GMT
    Content-Type: text/html; charset=UTF-8
    Content-Encoding: mi-sha256-03
    Date: Mon, 17 Aug 2020 16:08:24 GMT
    Vary: Accept-Encoding
signature:
    label;cert-sha256=<em>ViFgi0WfQ+NotPJf8PBo2T5dEuZ13NdZefPybXq/HhE=</em>;
    cert-url=&quot;https://test.web.app/ViFgi0WfQ-NotPJf8PBo2T5dEuZ13NdZefPybXq_HhE&quot;;
    date=1597680503;expires=1598285303;integrity=&quot;digest/mi-sha256-03&quot;;sig=<em>MEUCIQD5VqojZ1ujXXQaBt1CPKgJxuJTvFlIGLgkyNkC6d7LdAIgQUQ8lC4eaoxBjcVNKLrbS9kRMoCHKG67MweqNXy6wJg=</em>;
    validity-url=&quot;https://example.org/webpkg/validity&quot;
header integrity: sha256-Gl9bFHnNvHppKsv+bFEZwlYbbJ4vyf4MnaMMvTitTGQ=</p>

<p>The exchange has a valid signature.
payload [1256 bytes]:</p>
<pre class="prettyprint"><code>&lt;title&gt;SXG example&lt;/title&gt;
&lt;meta charset=&#34;utf-8&#34;&gt;
&lt;meta http-equiv=&#34;Content-type&#34; content=&#34;text/html; charset=utf-8&#34;&gt;
&lt;style type=&#34;text/css&#34;&gt;
body {
    background-color: #f0f0f2;
    margin: 0;
    padding: 0;
}
&lt;/style&gt;
</code></pre>
<div>
    <h1>Hello</h1>
</div>

<p>

הפרמטר expires בחתימה מציין את תאריך התפוגה של SXG. SXG יכול להיות תקף למשך 7 ימים לכל היותר. מידע נוסף על כותרת החתימה זמין במפרט של Signed HTTP Exchanges.

תמיכה בהתאמה אישית בצד השרת

קובץ SXG שמכיל כותרת Vary: Cookie יוצג רק למשתמשים שאין להם קובצי Cookie של כתובת ה-URL של הבקשה החתומה. אם האתר שלכם מציג HTML שונה למשתמשים שמחוברים לחשבון, אתם יכולים להשתמש בתכונה הזו כדי ליהנות מהיתרונות של SXG בלי לשנות את חוויית המשתמש. פרטים על התאמה אישית בצד השרת באמצעות SXG דינמי

אריזת אינטרנט

‫SXG הוא חלק ממשפחה רחבה יותר של הצעות למפרטים של Web Packaging. בנוסף ל-SXG, הרכיב העיקרי השני במפרט של Web Packaging הוא Web Bundles (חבילות של חילופי נתונים ב-HTTP). חבילות אינטרנט הן אוסף של משאבי HTTP והמטא-נתונים שנדרשים כדי לפרש את החבילה.

הקשר בין SXG לבין חבילות אינטרנט הוא נקודה נפוצה שגורמת לבלבול. ‫SXG ו-Web Bundles הן שתי טכנולוגיות נפרדות שלא תלויות זו בזו – אפשר להשתמש ב-Web Bundles גם עם חבילות חתומות וגם עם חבילות לא חתומות. מטרה משותפת שגם SXG וגם חבילות אינטרנט מקדמים היא יצירת פורמט של "אריזת אינטרנט" שמאפשר לשתף אתרים בשלמותם לצריכה אופליין.

האצת טעינת דפים באמצעות Signed Exchanges

הפעלת Signed Exchanges יכולה לעזור לשפר את מהירות הטעינה של דפי אינטרנט, וכך להשפיע על מדדי ה-Core Web Vitals של האתר, ובמיוחד על המהירות שבה נטען רכיב התוכן הכי גדול (LCP). חיפוש Google הוא אחד מהשירותים הראשונים שמשתמשים ב-SXG כדי לספק למשתמשים חוויית טעינה מהירה יותר של דפים שנטענים מדף תוצאות החיפוש.

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

SXG פועל בצורה הטובה ביותר בשילוב עם אופטימיזציות אחרות של ביצועים, כמו שימוש ב-CDN והפחתת משאבי משנה שחוסמים רינדור. אחרי ההטמעה, כדאי לפעול לפי ההמלצות האלה כדי למקסם את היתרון של LCP מאחזור מראש של SXG. במקרים רבים, אופטימיזציה כזו יכולה להוביל לטעינת דפים כמעט מיידית מחיפוש Google:

ההשפעה של Signed Exchanges

בניסויים קודמים ראינו ירידה ממוצעת של 300 עד 400 אלפיות השנייה ב-LCP באחזורים מראש שבהם מופעל SXG. כך האתרים יכולים ליצור רושם ראשוני טוב יותר על המשתמשים, ולעיתים קרובות יש לכך השפעה חיובית על המדדים העסקיים.

כמה מותגים ואתרים גלובליים כבר נהנים מהיתרונות של Signed Exchanges. כמקרה בוחן, נראה איך הטמעת חילופי נתונים חתומים עזרה ל-RebelMouse, מערכת ניהול תוכן (CMS) בולטת, לשפר את הביצועים ואת המדדים העסקיים של הלקוחות שלה:

  • ב-Narcity שיפרו את ה-LCP ב-41%
  • ב-Paper Magazine הבחינו בעלייה של 27% במספר הסשנים לכל משתמש
  • ב-MLT Blog הפחיתו את זמן הטעינה של הדף ב-21%

ב-Cloudflare גילו ש-SXG שיפר את ה-TTFB ב-98% מהאתרים שנבדקו, ושיפר את ה-LCP ב-85% מהאתרים, עם שיפור חציוני של יותר מ-20% בטעינות דפים שעומדים בדרישות של SXG.

הוספה לאינדקס

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

AMP

אפשר להציג תוכן AMP באמצעות SXG. ‫SXG מאפשר לאחזר מראש תוכן AMP ולהציג אותו באמצעות כתובת ה-URL הקנונית שלו, במקום כתובת ה-URL של ה-AMP.ל-AMP יש כלים נפרדים משלו ליצירת קובצי SXG.בכתובת amp.dev מוסבר איך להציג AMP באמצעות חילופי נתונים חתומים.

ניפוי באגים של קובצי SXG באמצעות כלי הפיתוח ל-Chrome

כדי לראות SXG, משתמשים בדפדפן Chromium, פותחים את כלי הפיתוח, פותחים את החלונית "רשת" ונכנסים לדף החיפוש לדוגמה הזה. כדי לזהות חילופי נתונים חתומים, מחפשים את הערך signed-exchange בעמודה Type.

צילום מסך של בקשת SXG בחלונית &quot;רשת&quot; בכלי הפיתוח
החלונית רשת בכלי הפיתוח

בכרטיסייה תצוגה מקדימה יש מידע נוסף על התוכן של SXG.

צילום מסך של הכרטיסייה &quot;תצוגה מקדימה&quot; של SXG
הכרטיסייה תצוגה מקדימה בכלי הפיתוח

כלים

כדי להטמיע SXG, צריך ליצור את ה-SXG שתואם לכתובת URL נתונה, ואז להציג את ה-SXG הזה למבקשים (בדרך כלל סורקים).

אישורים

כדי ליצור SXG, צריך אישור שיכול לחתום על SXG, אם כי חלק מהכלים רוכשים את האישורים האלה באופן אוטומטי. בדף הזה מפורטות רשויות האישורים שיכולות להנפיק אישור מהסוג הזה. אפשר לקבל אישורים באופן אוטומטי מרשות האישורים של Google באמצעות כל לקוח ACME. ל-Web Packager Server יש לקוח ACME מובנה, ובקרוב יהיה גם ל-sxg-rs.

כלי SXG ספציפיים לפלטפורמה

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

כלי SXG לשימוש כללי

שרת HTTP מסוג sxg-rs

‫sxg-rs http_server פועל בתור שרת proxy הפוך להצגת קובצי SXG. בבקשות מסורקי SXG, ‏http_server יחתום על התגובות מה-backend ויגיב באמצעות SXG. הוראות להתקנה מופיעות בקובץ README.

שרת Web Packager

Web Packager Server, webpkgserver, הוא חלופה ל-sxg-rs http_server, שנכתב ב-Go. להוראות להגדרת שרת Web Packager, ראו איך להגדיר חילופי נתונים חתומים באמצעות Web Packager.

Web Packager CLI

Web Packager CLI יוצר SXG שתואם לכתובת URL נתונה.

webpackager \
    --private\_key=private.key \
    --cert\_url=https://example.com/certificate.cbor \
    --url=https://example.com

אחרי שיוצרים את קובץ ה-SXG, מעלים אותו לשרת ומציגים אותו עם סוג ה-MIME‏ application/signed-exchange;v=b3. בנוסף, צריך להציג את אישור ה-SXG בתור application/cert-chain+cbor.

ספריות SXG

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

  • ‫sxg_rs היא ספריית Rust ליצירת קובצי SXG. זוהי ספריית ה-SXG העשירה ביותר בתכונות, והיא משמשת כבסיס לכלים cloudflare_worker ו-fastly_compute.

  • ‫libsxg היא ספריית C מינימלית ליצירת קובצי SXG. הוא משמש כבסיס למודול NGINX SXG ולמסנן Envoy SXG.

  • go/signed-exchange היא ספריית Go מינימלית שסופקה על ידי מפרט חבילת האינטרנט כהטמעת הפניה של יצירת SXG. הוא משמש כבסיס לכלי ה-CLI של קובץ העזר, gen-signedexchange, ולכלי Web Packager שכוללים יותר תכונות.

משא ומתן על תוכן

השרתים צריכים להציג SXG כשהכותרת Accept מציינת שערך ה-q של application/signed-exchange גדול מערך ה-q של text/html או שווה לו. בפועל, המשמעות היא ששרת מקור יציג SXG לסורקים, אבל לא לדפדפנים. רבים מהכלים שלמעלה עושים זאת כברירת מחדל, אבל בכלים אחרים, אפשר להשתמש בביטוי הרגולרי הבא כדי להתאים את כותרת ה-Accept של בקשות שצריך להציג כ-SXG: http Accept: /(^|,)\s\*application\/signed-exchange\s\*;\s\*v=[[:alnum:]\_-]+\s\*(,|$)/

ההמלצה הזו כוללת דוגמאות ל-Apache ול-nginx.

עדכון של Cache API

למטמון SXG של Google יש API שבעלי אתרים יכולים להשתמש בו כדי להסיר קובצי SXG מהמטמון לפני שהתוקף שלהם פג בגלל Cache-Control: max-age. פרטים נוספים זמינים במאמרי העזרה של ה-API לעדכון המטמון.

קישור ל-SXG

כל אתר יכול לשמור במטמון, להציג ולבצע אחזור מראש של קובצי SXG של הדפים שהוא מקשר אליהם, אם הם זמינים, באמצעות התגים ו- : html <a href="https://example.com/article.html.sxg"> <link rel="prefetch" as="document" href="https://example.com/article.html.sxg"> במאמר הזה מוסבר איך להשתמש ב-nginx כדי להפיץ קובצי SXG.

יתרונות ייחודיים

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

פחות בקשות להצגת מודעות

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

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

שיפור מהירות הדף

יכול להיות שתראו שיפור נוסף במהירות הדף בגלל הפלטפורמות והיכולות של האחזור מראש שנתמכות כרגע:

  • אפשר להציג קובצי SXG למשתמשים עם קובצי Cookie מהאתר שלכם.
  • בנוסף, SXG מאחזר מראש משאבי משנה של הדפים, כמו JavaScript, ‏ CSS, גופנים ותמונות, כשהם מצוינים באמצעות כותרת Link.
  • בעתיד הקרוב, אחזור מראש של SXG מחיפוש Google יהיה זמין בסוגים נוספים של תוצאות חיפוש.

סיכום

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

קריאה נוספת