地址自动补全（Google Maps）

启用地址自动补全后，买家一开始输入街道，Sami B2B Onboarding 就会显示 Google 的地址建议。选择某条建议后，该地址的其余信息会自动填好。买家填写表单更快，应用在 Shopify 中创建的公司营业地点也会得到规范的地址。

您只需为商店添加一个 Google Maps 密钥。每个表单可单独开启或关闭自动补全。

注意

开始之前，您需要一个已设置结算信息的 Google Cloud 账号。Google 要求先完成结算设置，才能使用其 Maps API。

在 Google Cloud 中创建浏览器密钥

1. 选择项目

   打开 Google Cloud 控制台，创建一个项目，或选择您要使用的项目。

2. 启用 API

   在 APIs & Services › Library 中，搜索并启用 Maps JavaScript API，然后启用 Places API。前者在您的店面加载地址建议，后者负责查找地址。

3. 创建密钥

   在 APIs & Services › Credentials 中，点击 Create credentials › API key。复制该密钥，它以 AIza 开头。

4. 将密钥限制为仅限您的商店使用

   打开该密钥的设置：

   1. 在 Application restrictions 下，选择 Websites，并添加访问您商店所用的每个域名，例如 https://example.com/* 和 https://your-store.myshopify.com/*。
   2. 在 API restrictions 下，选择 Restrict key，然后选中 Maps JavaScript API 和 Places API。
   3. 点击 Save。

警告

该密钥会写入您的店面页面，任何人都可以在页面中看到。网站限制可以防止他人盗用密钥，并避免您的 Google 账单被人刷高。应用面板也会提醒您：This key is printed into the storefront page, so restrict it to your store’s domain in the Google console.

添加密钥并启用

1. 打开 Address autocomplete 面板

   前往 Forms，点击表单旁的 Edit。在左侧栏中点击 Integrations。在 Connected apps 下，点击 Address autocomplete 行上的 Set up。

   Address autocomplete 面板随即打开，包含两个部分：Account 和 This form。

   

   点击 Set up 添加密钥；面板会说明哪个字段会显示建议，并提醒您限制密钥。

2. 粘贴密钥

   在 Account 下，点击 Set up。在 Address autocomplete 对话框中，将密钥粘贴到 Maps API key，然后点击 Save。您会看到 Keys saved，Account 行会显示该密钥。

3. 启用

   在面板底部点击 Enable。按钮会变为 Disable，Connected apps 中的 Address autocomplete 行会显示 Active。如果尚未保存密钥，会出现提示横幅：Add your Maps API key first.

4. 保存表单

   点击保存栏中的 Save。您会看到 Form saved。

会填充哪些字段

建议会出现在表单 Shopify 面板中映射到 Address line 1 的每个字段中。正如面板所述：When a buyer starts typing in a field mapped to Address line 1, Google suggests addresses. Picking one fills that block’s city, state, postal code and country.

买家选择某条建议后，应用会填写同一地址中映射到以下项目的字段：

映射到	填入内容
Address line 1	门牌号和街道名称
City	城市或城镇
State / province	州或省
ZIP / postal code	邮政编码
Country	国家/地区

• Address line 2、Recipient 和 Phone 留给买家自行填写。
• 收货地址和账单地址相互独立。选择收货地址不会更改账单字段。
• 买家仍然可以修改任何已自动填写的输入框。
• 建议使用的语言与商店页面的语言一致。

应用创建的 Wholesale application 表单已经为两个地址映射好了这些字段。如果您自行创建地址问题，请在 Company location 中映射。请参阅 将回答映射到 Shopify。

在店面中检查效果

1. 打开表单

   前往 Forms，点击表单旁的 Copy link。在无痕浏览窗口中打开该链接。

2. 输入地址

   在 Shipping address 下，开始在 Address line 1 中输入，例如 123 Main Street。Google 的建议列表会在输入框下方展开。

3. 选择建议

   点击列表中的某个地址。City、ZIP or postal code、Country 和 State or province 会按该地址自动填写。

如果没有出现建议：

检查项	处理方法
Address autocomplete 行显示 Active，并且表单已保存。	在面板中点击 Enable，然后点击 Save。
密钥的网站限制包含您正在测试的域名。	您的商店可通过自有域名和 myshopify.com 域名访问。请在 Google Cloud 中同时添加这两个域名。
已启用 Maps JavaScript API 和 Places API，并且项目已设置结算信息。	在 APIs & Services › Library 中启用它们。
该字段已映射到 Address line 1。	在 Shopify 面板的 Company location 下进行映射。

关闭

• 对单个表单：打开其 Address autocomplete 面板，点击 Disable，然后点击 Save。
• 对所有表单：在 Account 下，点击 Change，然后点击 Remove keys。对话框会警告：Every form in this store stops using Address autocomplete until you add keys again. 点击 Remove keys 确认。

后续步骤

• 将回答映射到 Shopify — 映射您的地址问题，使其填入公司营业地点。
• 创建表单 — 为表单添加地址字段。
• 验证码（reCAPTCHA、hCaptcha） — 防止机器人访问同一个表单。