Tài liệu này đưa ra các đề xuất về cách định cấu hình Chính sách bảo mật nội dung (CSP) của trang web cho Maps JavaScript API. Vì người dùng cuối sử dụng nhiều loại và phiên bản trình duyệt, nên nhà phát triển nên tham khảo ví dụ này, tinh chỉnh cho đến khi không còn hành vi vi phạm CSP nào nữa.
Tìm hiểu thêm về Chính sách bảo mật nội dung.
CSP nghiêm ngặt
Bạn nên sử dụng CSP nghiêm ngặt
thay vì CSP danh sách cho phép để giảm thiểu khả năng bị tấn công bảo mật.
Maps JavaScript API hỗ trợ việc sử dụng CSP nghiêm ngặt dựa trên nonce.
Trang web phải điền cả phần tử script và style bằng giá trị nonce.
Về nội bộ, Maps JavaScript API sẽ tìm phần tử đầu tiên như vậy và áp dụng giá trị nonce của phần tử đó cho các phần tử kiểu hoặc tập lệnh do tập lệnh API chèn vào.
Ví dụ:
Ví dụ sau đây minh hoạ một CSP mẫu, cùng với trang HTML nơi CSP đó được nhúng:
Chính sách bảo mật nội dung mẫu
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:;
Trang HTML mẫu
<!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 danh sách cho phép
Nếu bạn đã thiết lập CSP danh sách cho phép, vui lòng tham khảo danh sách Miền của Google Maps. Bạn nên tham khảo tài liệu này và ghi chú phát hành Maps JavaScript API để luôn cập nhật thông tin mới nhất, đồng thời đưa mọi miền dịch vụ mới vào danh sách cho phép nếu cần.
Các trang web tải Maps JavaScript API từ miền API Google cũ (ví dụ: maps.google.com) hoặc miền dành riêng cho khu vực (ví dụ: maps.google.fr) cũng phải đưa các tên miền này vào chế độ cài đặt script-src của CSP, như trong ví dụ sau:
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:;