内容安全政策指南

本文档提供了有关如何为 Maps JavaScript API 配置网站内容安全政策 (CSP) 的建议。由于最终用户使用的浏览器类型和版本多种多样，因此建议开发者参考此示例进行微调，直至不再出现 CSP 违规行为。

详细了解内容安全政策。

严格 CSP

建议您使用严格 CSP（而不是许可名单 CSP），以降低遭到安全攻击的可能性。Maps JavaScript API 支持使用基于 Nonce 的严格 CSP。网站必须使用 Nonce 值填充 script 和 style 元素。在内部，Maps JavaScript API 会查找第一个这类元素，然后将其 Nonce 值分别应用于该 API 脚本插入的各个样式元素或脚本元素。

示例

下例展示了一个示例 CSP，以及嵌入了该 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 版本说明，及时了解最新动态，并根据需要将任何新的服务网域列入许可名单。

如果网站从旧版 Google API 网域（例如 maps.google.com）或区域专用网域（例如 maps.google.fr）加载 Maps JavaScript API，还必须在其 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:;