במסמך הזה מפורטות המלצות להגדרת Content Security Policy (CSP) של האתר ל-Maps JavaScript API. משתמשי הקצה משתמשים במגוון רחב של סוגי דפדפנים וגרסאות, ולכן מומלץ למפתחים להשתמש בדוגמה הזו כהפניה ולבצע התאמות עד שלא יתרחשו יותר הפרות של CSP.
מידע נוסף על Content Security Policy
Strict CSP
כדי להגן על האתר מפני מתקפות שמקורן בפרצת אבטחה XSS (cross-site scripting), מומלץ להשתמש במדיניות CSP מחמירה במקום במדיניות CSP עם רשימת היתרים. Maps JavaScript API תומך בשימוש ב-CSP מחמיר שמבוסס על nonce. אתרים חייבים לאכלס את הרכיבים script ו-style בערך nonce. באופן פנימי, Maps JavaScript API ימצא את הרכיב הראשון מסוג זה, ויחיל את ערך ה-nonce שלו על רכיבי הסגנון או הסקריפט שנוספו על ידי הסקריפט של ה-API, בהתאמה.
מילת המפתח 'strict-dynamic' בדוגמה הבאה מאפשרת לסקריפט עם מספר חד-פעמי תקין לטעון סקריפטים אחרים. מכיוון שטעינת הדף טוענת את Maps JavaScript API עם צופן חד-פעמי (nonce), ה-API יכול לטעון את הסקריפטים הנוספים שהוא צריך, כך שאין צורך לציין דומיינים של Google ב-script-src. דפדפנים שתומכים ב-'strict-dynamic' מתעלמים מהמקור https: בדוגמה. הוא משמש רק כחלופה לדפדפנים ישנים יותר.
דוגמה
בדוגמה הבאה מוצגת מדיניות CSP לדוגמה, יחד עם דף HTML שבו היא מוטמעת:
דוגמה למדיניות אבטחת תוכן
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), צריכים לכלול גם את שמות הדומיינים האלה בהגדרת ה-CSP שלהם script-src, כמו בדוגמה הבאה:
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:;