คู่มือนโยบายความปลอดภัยของเนื้อหา

เอกสารนี้จะให้คำแนะนำเกี่ยวกับวิธีกำหนดค่านโยบายรักษาความปลอดภัยเนื้อหา (CSP) ของเว็บไซต์สำหรับ Maps JavaScript API เนื่องจากผู้ใช้ปลายทางใช้เบราว์เซอร์หลายประเภทและเวอร์ชันที่หลากหลาย เราจึงขอแนะนําให้นักพัฒนาซอฟต์แวร์ใช้ตัวอย่างนี้เป็นข้อมูลอ้างอิง แล้วปรับแต่งจนกว่าจะไม่เกิดการละเมิด CSP อีก

ดูข้อมูลเพิ่มเติมเกี่ยวกับนโยบายรักษาความปลอดภัยเนื้อหา

CSP เข้มงวด

เราขอแนะนำให้ใช้ CSP ที่เข้มงวดในรายการที่อนุญาตสำหรับ CSP เพื่อลดโอกาสเกิดการโจมตีด้านความปลอดภัย Maps JavaScript API รองรับการใช้ CSP ที่ไม่เข้มงวดตามเกณฑ์ เว็บไซต์ต้องป้อนทั้งองค์ประกอบ script และ style ด้วยค่า nonce Maps JavaScript API ภายในจะค้นหาองค์ประกอบแรกดังกล่าวและใช้ค่า Nonce ขององค์ประกอบกับองค์ประกอบรูปแบบหรือสคริปต์ที่แทรกโดยสคริปต์ API ตามลำดับ

ตัวอย่าง

ตัวอย่างต่อไปนี้แสดงตัวอย่าง CSP พร้อมหน้า HTML ที่ฝัง CSP

ตัวอย่างนโยบายรักษาความปลอดภัยเนื้อหา

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 เราขอแนะนำให้อ่านเอกสารนี้และบันทึกประจำรุ่นของ 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:;