> ## Documentation Index
> Fetch the complete documentation index at: https://docs.landerlab.io/llms.txt
> Use this file to discover all available pages before exploring further.

# 在测验漏斗中使用 Google 地址自动补全

> 在 LanderLab 的落地页上启用 Google Address Autocomplete（地址自动补全），加快表单填写速度、减少错误，并从访客处收集准确的地址数据。

> 在 LanderLab 的落地页中添加 Google Address Autocomplete，即可在访客输入时实时显示地址建议，让地址字段填写得更快、更准确。

## 什么是 Google Address Autocomplete？

Google Address Autocomplete 使用 Google Places API，在访客开始在地址字段中输入时实时显示地址建议。访客无需手动输入完整地址，只需从匹配的建议列表中选择即可，从而加快表单填写速度并减少输入错误。

要在 LanderLab 中使用此功能，你需要完成两件事：

1. 在编辑器中将 **Google Address Autocomplete Input 区块**添加到你的测验或表单中
2. 通过集成面板连接你的 **Google Places API 密钥**

这两步缺一不可，否则自动补全建议不会出现。

<Note>
  添加 Google Address Autocomplete 集成后，它会被**全局**保存在你的账户中。你可以在多个落地页中重复使用，无需再次输入详细信息。
</Note>

## 第 1 部分：添加自动补全输入区块

首先，在你想收集地址数据的测验或表单步骤中，添加这个专用的地址输入字段。

<Steps>
  <Step title="打开 Quiz Editor">
    打开包含你的测验漏斗的落地页，点击进入 **Quiz Editor**（测验编辑器）。
  </Step>

  <Step title="前往地址步骤">
    进入你想收集访客地址的步骤。
  </Step>

  <Step title="添加区块">
    点击 **Add Block**，搜索 **Google Address Autocomplete Input**，并将其拖到你的测验步骤中。
  </Step>
</Steps>

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/hQLLLMPAbDBPhaNj/images/google-address-autocomplete.png?fit=max&auto=format&n=hQLLLMPAbDBPhaNj&q=85&s=52f620d1dce4d0e4c94c5682fd61e326" alt="测验步骤中的 Google 地址自动补全输入区块" width="1920" height="988" data-path="images/google-address-autocomplete.png" />
</Frame>

这样该字段就准备好接收地址建议了。但在你于第 2 部分中连接 Google Places API 密钥之前，建议还不会显示。

## 第 2 部分：连接你的 Google Places API 密钥

添加区块后，通过集成面板连接你的 Google Places API 密钥。

<Steps>
  <Step title="进入你的落地页">
    前往 **Landing Pages**，点击你想启用地址自动补全的**落地页名称**。
  </Step>

  <Step title="打开集成标签页">
    点击 **Add Integration** 打开集成面板。
  </Step>

  <Step title="选择 Google Address Autocomplete">
    在可用集成列表中找到 **Google Address Autocomplete** 并点击。随后会出现配置表单。
  </Step>

  <Step title="填写必填字段">
    输入以下信息：

    | 字段 | 说明 |
    | :- | :- |
    | **Name** | 用于识别该集成的标签（例如“Google Address Autocomplete”）。在多个页面间复用时，方便你辨认。 |
    | **API Key** | 你在 Google Cloud Console 中获取的 Google Places API 密钥。 |

    <Tip>
      如果你还没有创建密钥，请参阅下方的**如何获取 Google Places API 密钥**部分。
    </Tip>
  </Step>

  <Step title="保存并发布">
    点击 **Add Google Address Autocomplete** 保存集成，然后点击 **Publish** 或 **Republish** 发布你的落地页。现在，访客在地址字段中输入时，地址建议就会实时出现。
  </Step>
</Steps>

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/hQLLLMPAbDBPhaNj/images/google-api.png?fit=max&auto=format&n=hQLLLMPAbDBPhaNj&q=85&s=25fe80c95ecdb83ad6387c5c2a843ee1" alt="输入 Google Places API 密钥的集成表单" width="1920" height="990" data-path="images/google-api.png" />
</Frame>

## 连接到其他落地页

由于 Google Address Autocomplete 集成是全局保存的，你无需为每个落地页单独创建新集成。

<Steps>
  <Step title="打开另一个落地页">
    前往 **Landing Pages**，点击你想使用同一集成的落地页名称。
  </Step>

  <Step title="添加集成">
    点击 **Add Integration**。你会看到之前保存的 Google Address Autocomplete 配置列表，选择你要连接的那一个。
  </Step>

  <Step title="选择变体（如适用）">
    如果你的落地页有多个 **A/B 测试变体**，会弹出一个窗口，让你选择哪些变体使用该集成。选择所需变体并确认。
  </Step>

  <Step title="保存并发布">
    点击 **Save**，然后点击 **Publish** 或 **Republish** 发布你的落地页，即可在所选变体上启用地址自动补全。
  </Step>
</Steps>

## 如何获取 Google Places API 密钥

如果你还没有 Google Places API 密钥，请按照以下步骤在 Google Cloud Console 中创建一个。

<Steps>
  <Step title="打开 Google Cloud Console">
    访问 [console.cloud.google.com](https://console.cloud.google.com)，并使用你的 Google 账户登录。
  </Step>

  <Step title="创建或选择项目">
    点击页面顶部的 **Select a Project**，选择一个现有项目，或点击 **New Project** 创建新项目。
  </Step>

  <Step title="启用 Places API">
    1. 在左侧边栏中进入 **APIs and Services**。
    2. 点击 **Library**。
    3. 搜索 **Places API**。
    4. 点击进入，然后点击 **Enable**。
  </Step>

  <Step title="创建 API 密钥">
    1. 进入 **APIs and Services > Credentials**。
    2. 点击 **+ Create Credentials** 并选择 **API Key**。
    3. 复制生成的 API 密钥，并粘贴到 LanderLab 中的 **API Key** 字段。
  </Step>

  <Step title="限制你的 API 密钥（推荐）">
    为防止密钥被未经授权使用，请在 API 密钥设置中添加限制：

    * 在 **API restrictions** 下，选择 **Places API**，使该密钥只能用于地址自动补全。
    * 在 **Application restrictions** 下，选择 **HTTP referrers (websites)**，并添加你的落地页域名。

    这样可以确保你的 API 密钥不会被其他网站或服务使用。
  </Step>
</Steps>

<Warning>
  Google 要求你的 Google Cloud 项目**启用结算**（billing）才能使用 Places API。不过，Google 每月提供 **\$200 的免费额度**，对大多数落地页地址自动补全场景来说绰绰有余。
</Warning>

## Google Address Autocomplete 使用技巧

* **两个步骤都必须完成** - 只添加输入区块而不连接 API 密钥（反之亦然），只会得到一个没有任何建议的普通文本字段。请确保同时完成第 1 部分和第 2 部分。
* **连接后务必发布** - 添加集成后，只有重新发布落地页，自动补全建议才会出现在线上页面中。
* **限制你的 API 密钥** - 未加限制的 API 密钥可以被任何发现它的人使用。请始终在 Google Cloud Console 中设置 API 和域名限制，以保护你的用量和账单。
* **需要启用结算，但通常是免费的** - 你必须为 Google Cloud 项目启用结算，但除非你的流量非常大，Google 提供的每月 \$200 免费额度足以满足几乎所有落地页使用场景。


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.