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

דף זה תורגם על ידי Cloud Translation API.

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

במסמך הזה מפורטות המלצות איך להגדיר את האתר Content Security Policy (CSP) עבור Maps JavaScript API. מכיוון שמשתמשי הקצה משתמשים במגוון רחב של גרסאות וסוגי דפדפנים, אנחנו ממליצים למפתחים להשתמש בדוגמה הזו כחומר עזר, לבצע כוונון עד שלא יימצאו הפרות נוספות של מדיניות CSP.

מידע נוסף על Content Security Policy

מדיניות CSP מחמירה

כדי לצמצם את הסיכון למתקפות אבטחה, מומלץ להשתמש במדיניות CSP מחמירה במסגרת רשימת ההיתרים של CSP. ממשק API של JavaScript במפות Google תומך בשימוש ב-CSP מחמיר שמבוסס על nonce. האתרים צריכים לאכלס את הרכיבים script ו-style עם ערך צופן חד-פעמי (nonce). באופן פנימי, Maps JavaScript API ימצא את הרכיב הראשון מסוג זה, ויחיל את ערך הצופן שלו (nonce) על סגנון או על רכיבי סקריפט שנוספו על ידי סקריפט ה-API, בהתאמה.

דוגמה

בדוגמה הבאה מוצג קוד CSP לדוגמה, לצד דף HTML שבו הוא מוטמע:

דוגמה למדיניות Content Security Policy

script-src 'nonce-{script value}' 'strict-dynamic' https: 'unsafe-eval' blob:;
img-src 'self' https://*.googleapis.com https://*.gstatic.com *.google.com *.googleusercontent.com data:;
frame-src *.google.com;
connect-src 'self' https://*.googleapis.com *.google.com https://*.gstatic.com data: blob:;
font-src https://fonts.gstatic.com;
style-src 'nonce-{style value}' https://fonts.googleapis.com;
worker-src blob:;

דף HTML לדוגמה

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="style.css" nonce="{style value}">
    <style nonce="{style value}">...</style>
    ...
  </head>
  <body>
    <div id="map"></div>
    <script src="https://maps.googleapis.com/maps/api/js?key=&callback=initMap" async nonce="{script value}"></script>
    <script nonce="{script value}"> function initMap() { ... } </script>
  </body>
</html>

מדיניות CSP ברשימת ההיתרים

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

אתרים שטעינים את Maps JavaScript API מדומיין קודם של Google APIs (לדוגמה, maps.google.com) או מדומיין ספציפי לאזור (לדוגמה, maps.google.fr) חייבים לכלול גם את שמות הדומיינים האלה בהגדרה script-src של ה-CSP, כפי שמוצג בדוגמה הבאה:

script-src 'self' 'unsafe-inline' 'unsafe-eval' https://*.googleapis.com https://*.gstatic.com *.google.com https://*.ggpht.com *.googleusercontent.com blob:;
img-src 'self' https://*.googleapis.com https://*.gstatic.com *.google.com  *.googleusercontent.com data:;
frame-src *.google.com;
connect-src 'self' https://*.googleapis.com *.google.com https://*.gstatic.com  data: blob:;
font-src https://fonts.gstatic.com;
style-src 'self' 'unsafe-inline' https://fonts.googleapis.com;
worker-src blob:;