תחילת העבודה

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

דרישות מוקדמות

כדי שאופטימיזציה של תמונות ב-Cloud CDN תפעל, צריך לוודא שמתקיימים התנאים המוקדמים הבאים:

  • צריך להפעיל את מדיניות המטמון של Cloud CDN בנתיב של כתובת ה-URL או בשירות לקצה העורפי או בקטגוריה המשויכים, ולהפעיל את תכונת אופטימיזציית התמונות במפת URL זו.

  • אפשר לבצע אופטימיזציה של תמונות רק במאזני עומסים גלובליים חיצוניים של אפליקציות (ALB). אי אפשר לבצע אופטימיזציה במאזן עומסים קלאסי של אפליקציות.

  • בקשת הלקוח חייבת לכלול כותרת Accept שמציינת שהלקוח יכול לקבל תוכן תמונה, כמו image/webp, image/avif, image/* או */*.

  • שרת המקור חייב להגיב עם קוד סטטוס HTTP 200 וכותרת תמונה נתמכת Content-Type.

  • פרמטר השאילתה imop צריך להיכלל בכתובת ה-URL ולהכיל פעולת טרנספורמציה אחת או יותר.

הגדרת אופטימיזציה של תמונות

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

  • שמירה במטמון שמבוססת על קצה עורפי: מוודאים שתיבת הסימון Enable Cloud CDN (הפעלת Cloud CDN) מסומנת בקצה העורפי.

  • שמירה במטמון ברמת מפת URL: צריך לוודא שמדיניות שמירה במטמון מוגדרת ברמת מפת URL עבור הנתיב הספציפי שבו אתם מתכננים להפעיל אופטימיזציה של תמונות.

gcloud

צריך להוסיף הגדרות לקובץ ה-YAML ולייבא אותו למפת URL, כי מדיניות האופטימיזציה של התמונות מוגדרת בתוך האובייקט routeAction.

מייצאים את ההגדרה הקיימת של מפת URL לקובץ YAML מקומי:

gcloud beta compute url-maps export YOUR_URL_MAP_NAME \
    --global \
    --destination my-url-map.yaml

עורכים את הקובץ my-url-map.yaml בכלי לעריכת טקסט ומוסיפים את השדה imageOptimizationPolicy לקטעים routeAction או defaultRouteAction שנבחרו.

name: image-matcher
routeRules:
  - description: ImageOptimizationService
    matchRules:
      - prefixMatch: /images/
    priority: 1
    routeAction:
      imageOptimizationPolicy:
        queryParameterInterpretation: ENABLED

ייבוא של מפת ה-URL המעודכנת

gcloud beta compute url-maps import YOUR_URL_MAP_NAME \
    --global \
    --source my-url-map.yaml

המסוף

  1. נכנסים לדף Load Balancing במסוף Google Cloud .

    לדף Load balancing

  2. לוחצים על השם של מאזן העומסים הגלובלי החיצוני של האפליקציות.
  3. לוחצים על Edit ‏.
  4. עוברים לכרטיסייה Backend configuration.
  5. הגדרת שמירה במטמון: כדי שהאופטימיזציה של התמונות תישמר בהצלחה, צריך להפעיל שמירה במטמון. כדי שהאפשרות 'אופטימיזציה של תמונות' תפעל, צריך לבחור ולהגדיר אחת מהאפשרויות הבאות.
    • מבוסס קצה עורפי: מוודאים שהאפשרות Enable Cloud CDN מסומנת בהגדרות של Backend Service.
    • רמת מפת URL:
      1. עוברים אל כללי ניתוב ובוחרים באפשרות כלל מתקדם של מארח ונתיב.
      2. מגדירים מדיניות מטמון ברמת מפת URL במסלול שבו מפעילים את האופטימיזציה של התמונות.

בהתאם לארכיטקטורת הניתוב, בוחרים באחד מכללי הניתוב:

כדי להשתמש בכלל ברירת המחדל לניתוב:

  1. בקטע Host and path rules (כללים לגבי מארח ונתיב), בקטע Action (פעולה), בוחרים באפשרות Route traffic to a single backend mode (ניתוב תנועה למצב קצה עורפי יחיד), ואז בוחרים קצה עורפי מהרשימה.
  2. מרחיבים את הקטע 'אופטימיזציה של תמונות' (מכווץ כברירת מחדל).
  3. מסמנים את תיבת הסימון הפעלת אופטימיזציה של תמונות.

כדי להשתמש בכלל ניתוב בהתאמה אישית:

  1. בקטע Host and path rules (כללי מארח ונתיב), לוחצים על Add host and path rule (הוספת כלל מארח ונתיב).
  2. בשדה מארחים, מזינים * כדי להתאים לכל שמות המארחים.
  3. בקטע Path matcher, משתמשים בעורך YAML כדי להגדיר את התצורה.
  4. לוחצים על Code guidance (הנחיות לגבי הקוד) מתחת לעורך YAML כדי לקבל הנחיות לגבי הקוד.
  5. מעתיקים את קטע הקוד ומדביקים אותו בעורך ה-YAML.
  6. מעדכנים את הערכים הזמניים לשמירת מקום.

בדיקת ההגדרות

  1. בודקים את ההגדרות.
  2. לוחצים על סיום כדי לסגור את עורך המשנה.
  3. לוחצים על עדכון כדי לשמור את ההגדרות.

פורמטים נתמכים של תמונות

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

הפורמטים הבאים של תמונות נתמכים משרת המקור:

פורמט כותרת Content-Type קלט/פלט תרחיש לדוגמה
gif image/gif קלט ופלט פורמט סטנדרטי של אנימציה או תמונה סטטית. אפשר לחלץ פריימים מונפשים באמצעות הפעולה Freeze.
png image/png קלט ופלט פורמט ללא אובדן מידע, אידיאלי לשקיפות, ללוגו ולאומנות דיגיטלית.
webp image/webp קלט ופלט פורמט מודרני שעבר אופטימיזציה לאינטרנט, עם דחיסת נתונים מסוג lossy ו-lossless.
jpeg image/jpeg קלט ופלט פורמט צילום סטנדרטי.
brunsli image/x-j קלט ופלט פורמט דחיסה יעיל של JPEG ללא אובדן נתונים.
tiff image/tiff קלט ופלט פורמט רסטר מבוסס-תגים באיכות גבוהה.
avif image/avif קלט ופלט פורמט תמונות מהדור הבא עם יעילות גבוהה.
bmp image/bmp קלט בלבד אי אפשר לציין אותו כפורמט פלט. ממירים לפורמט WEBP או JPEG באמצעות ?imop=Convert,format=webp.
ico text/ico, image/ico, image/icon, application/ico, image/x-icon, image/vnd.microsoft.icon קלט בלבד פורמט מאגר הסמלים. אי אפשר לייצא אותו. צריך להמיר אותו לפורמט פלט נתמך כדי להציג אותו.
jp2k image/jp2 קלט בלבד פורמט JPEG 2000. חובה להמיר אותו באופן מפורש באמצעות פעולת Convert.
heif image/heif קלט בלבד פורמט תמונה בעל יעילות גבוהה. צריך להמיר את הפורמט לפני המסירה דרך קצה הרשת.

כתובת URL של טרנספורמציה של תמונה

כדי לבצע שינויים דינמיים בתמונה, מוסיפים את פרמטר השאילתה imop לכתובת ה-URL של התמונה. הפרמטר הזה מכיל מחרוזת של טרנספורמציה, שמורכבת מפעולה אחת או יותר שמוחלות ברצף.

מחרוזת ההמרה מבוססת על כללי הפורמט הבאים:

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

התחביר של תנאי הבסיס הוא:

?imop=[OPERATION_1];[OPERATION_2];...[OPERATION_N]

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

לדוגמה,

https://www.example.com/image.jpg?imop=Resize,width=800;Compress,quality=85;Convert,format=webp;

מבנה המדיניות

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

שם

תיאור

Configuration

queryParameterInterpretation

ערך Enum שקובע אם פרמטר השאילתה לאופטימיזציה של תמונות יפורש במישור הנתונים.

חובה. אם המדיניות מוגדרת כ-DISABLED, המערכת תתעלם מפרמטרים של שאילתות לצורך שינוי, וכך התכונה הזו תושבת. אם המדיניות מוגדרת לערך ENABLED, התכונה הזו תופעל.

תלות במדיניות ואימות

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

  • אותו מסלול של מיפוי כתובות URL שבו מוגדרת מדיניות האופטימיזציה של התמונות.

  • שירות לקצה העורפי או קטגוריית קצה עורפי שקשורים למסלול הספציפי הזה.

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

כללי סדר לאופטימיזציה של תמונות

הפעולות שמפורטות בפרמטר השאילתה imop מעובדות משמאל לימין, למעט חריגים של ביטולים מוחלטים של המערכת:

  • פעולות שקשורות למטא-נתונים ולקנה מידה תמיד מבוצעות ראשונות.
  • פעולות canvas תמיד מבוצעות אחרונות.

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

המאמרים הבאים