跳转到内容

把 Google Maps 连接到你的 MonstarX 应用

要点你的应用本来就能免费显示地图。如果你需要 Google 的数据(搜索地点、输入地址时自动补全、商家详情和评价,或路线规划),就连接 Google Maps。在 Google Cloud 中创建 API 密钥,粘贴到“后端 → 云服务”中,然后提出功能需求。

Google 的地图、地点搜索和路线规划。

类型
用于你的应用
类别
地图与地点
连接方式
API 密钥

Google Maps Platform 是 Google 的地图数据服务:Google 地图背后的地点、地址、营业时间、评价和路线。连接后,你的应用就能在这些数据中查询信息。

单纯显示地图并不需要它。每个 MonstarX 应用都能免费绘制可拖动、可缩放、带图钉的街道地图,详见应用中的地图。Google Maps 用来提供这些地图本身无法知道的信息。

  • 地址自动补全:用户开始输入地址,就能从 Google 的建议中选择。
  • 地点搜索:“我附近的咖啡馆”“Fitzroy 的物理治疗师”,以列表和地图的形式显示。
  • 商家详情:某个地点的营业时间、电话号码、评分和评价。
  • 在地图上标出地址:把输入的地址变成地图上的图钉(这叫地理编码)。
  • 两地之间的驾车路线。
  • 一个已关联结算账号的 Google Cloud 账户。Google Maps Platform 要求必须有结算账号,即使用量在每月免费额度内也一样(详见 Google 的价格)。
  • 为你的应用准备一个 Google Cloud 项目。
  1. 在 Google Cloud 控制台中,选择或创建一个项目,然后打开 Google Maps Platform。

  2. 启用你的应用要用到的 API。针对上面这些用途:搜索和自动补全需要 Maps JavaScript API 和 Places API (New),地址需要 Geocoding API,路线需要 Routes API。

  3. 打开密钥和凭据(Keys & Credentials),创建一个 API 密钥并复制(以 AIza 开头)。

  4. 限制这个密钥。在 API 限制(API restrictions)下,只允许你启用的那些 API。

  1. 打开你的项目,点击顶部栏中的后端,再点击云服务。

  2. 在连接器下,点击 Google Maps 旁边的连接。

  3. 把密钥粘贴到 API 密钥中。

  4. 点击连接 Google Maps。这一行会显示已连接,你的预览会带着这个密钥重新启动。

你输入会发生什么
“在预约表单上,用 Google Maps 自动补全地址。”用户输入时会出现建议,选中的地址会被保存。
“加一个‘查找你附近的工作室’页面,使用 Google Places 搜索。”一个搜索框和搜索结果,显示名称、地址和评分,并在地图上标出。
“显示 Google 上每家咖啡馆的营业时间和评分。”为每个地点从 Google 获取商家详情。
“为司机提供从仓库到每个送货地址的路线。”一条显示距离和时间的路线。
  • 这个密钥是公开密钥:它在用户的浏览器中使用,所以不是隐藏的。真正保护它的是在 Google Cloud 中设置的限制。
  • 它只和这个应用一起存储。你可以在 后端密钥 中看到它的名称。
  • 只有项目所有者可以连接、更新或断开 Google Maps。
  • 如果要更换密钥,请在 Google Cloud 中创建一个新密钥,点击 Google Maps 一行中的更新密钥,粘贴后点击保存密钥。重新发布,然后删除旧密钥。
  • 你的地图外观保持不变:Google Maps 为你的应用添加的是数据和搜索,而不是 Google 的地图图块。
  • 超出每月免费用量后,Google 会按请求收费。请在 Google Cloud 结算中设置预算提醒。
  • 想要卫星视图或 Mapbox 的地图样式?请参阅 Mapbox。
  • Google 的条款对展示其地点数据有规定,比如在结果旁边注明来自 Google。如果你的应用会列出地点,请让 MonstarX 加上来源说明。
显示地图需要 Google Maps 吗?

不需要。每个 MonstarX 应用都能免费绘制地图,无需密钥。只有需要地点、自动补全、商家详情或路线时,才需要连接 Google Maps。

为什么 Google 提示 API 未启用?

每项 Google Maps 服务都需要在你的 Google Cloud 项目中单独启用。启用错误信息中提到的那个,例如 Places API (New)。

密钥放在浏览器里安全吗?

安全,前提是把它限制为你的应用使用的那些 API。Google 本来就是把这类密钥设计成在网页中使用的。

用 Google Maps 还是 Mapbox?

需要地点、商家详情和评价,选 Google Maps。需要自定义地图样式和卫星视图,选 Mapbox。两者都能把地址变成图钉,也都能提供路线。