多元化交易實作指南

總覽

網頁 iOS API

Google 地圖平台支援網頁 (JavaScript、TypeScript)、Android 和 iOS,也提供網頁服務 API,可擷取地點、路線和距離等資訊。本指南只以一種平台舉例說明,同時提供其他平台的說明文件連結,方便您參考。

使用者通常很難理解交易陳述式,例如使用「ACMEHCORP」這類縮寫,而非「Acme Houseware」這類商家名稱,這樣可能會導致客戶服務來電數增加,及引發代價高昂的糾紛。「多元化交易」可簡化這些交易,讓使用者一看就懂,方法包括提供商家全名和業務類別、店面相片、地圖上的地址和地點、完整的聯絡資訊等等。這不但有助於提升使用者滿意度和透明度,也能減少客戶服務來電數、增加淨推薦值,以及吸引使用者在應用程式內停留更長時間。

「多元化交易」完美結合各項 Google 地圖平台 API,有助您打造良好的交易記錄使用體驗。建議您參閱本主題介紹的實作指南和自訂提示,瞭解如何運用多元化交易。本實作指南會說明如何將地點與特定商家進行比對,以及如何顯示商家詳細資訊。

「多元化交易」範例畫面
「多元化交易」範例畫面 (按一下即可放大)

啟用 API

如要導入「多元化交易」,您必須在 Google Cloud 控制台中啟用下列 API。以下超連結會將您帶往 Google Cloud 控制台,針對已選取的專案啟用各項 API:

如要進一步瞭解設定,請參閱「開始使用 Google 地圖平台」一文。

實作指南章節

以下為本主題將說明的導入和自訂項目。

  • 勾號圖示代表核心導入步驟。
  • 星號圖示為選用但建議使用的自訂項目,可強化解決方案。
將商家與 Google 地圖平台進行比對 將交易記錄中的商家與 Google 地圖平台中的地點建立關聯。
顯示商家詳細資料 顯示資料豐富的交易來提供與商家相關的實用資訊,方便使用者快速辨識交易。
新增商家地點的地圖 新增商家地點的地圖。

將商家與 Google 地圖平台進行比對

此範例使用:Places API

下圖說明應用程式如何使用現有商家資料庫的 Place Details 或透過 Place Search 要求,比對商家交易並傳回結果:

商家比對流程矩陣
商家比對流程矩陣 (按一下可放大)

取得 Google 地圖平台地點 ID

您可能已建有商家資料庫,內有商家名稱及相關地址等基本資訊。如要取得 Google 地圖平台內的地點資訊 (包括聯絡資訊和使用者提供的資訊),您必須備妥與資料庫內各商家對應的 Google 地圖平台地點 ID。

而要取得商家地點 ID,可以向 Places API 中的 /findplacefromtext 端點發出要求,且限定只要 place_id 欄位即可;這樣系統才會認定這是不收費的 Find Place - ID only 呼叫。如果商家有多個地點,請將商家名稱與城市或街道名稱搭配使用。呼叫傳回的資料品質各不相同,因此您必須確認傳回的結果是否確實與所需商家相符。

以下舉例說明如何使用商家名稱和城市要求 Google 台北辦公室的地點 ID:

https://maps.googleapis.com/maps/api/place/findplacefromtext/json?input=google%20taipei&inputtype=textquery&fields=place_id&key=YOUR_API_KEY&solution_channel=GMP_guides_enrichedtransactions_v1_a

請務必對 API 要求中的輸入參數進行網址編碼

儲存地點 ID

如要儲存 Google 地圖平台上的商家資訊,以便用於日後的要求,您可以將此地點 ID 當成商家記錄屬性,無限期儲存於資料庫中。您應只需為每個商家執行一次「尋找地點」要求。此外,您也可以在每次使用者要求交易明細時搜尋地點 ID。

為確保您隨時都能取得最準確的資訊,請使用 place_id 參數搭配 Place Details 要求,每 12 個月重新整理一次地點 ID

如果顯示的 Place Details 與交易商家不符,建議您允許使用者針對商家比對的品質提出意見。

顯示商家詳細資料

此範例使用:Places API 同時支援:Places SDK for Android | Places SDK for iOS | Maps JavaScript API 的 Places Library

您可以在使用者造訪其中一個地點後,向他們提供必要的 Place Details。有了豐富的 Place Details (例如聯絡資訊、營業時間、使用者評分和使用者相片),應用程式便可提醒使用者有哪些已完成的交易。呼叫 Places API 並取得 Place Details 後,您可在資訊視窗、網頁側欄,或以任何其他方式篩選及呈現回應。

商家詳細資料畫面範例
商家詳細資料畫面範例 (按一下即可放大)

如想要求 Place Details,您需要各個地點的地點 ID。請參閱「取得地點 ID」一節,瞭解如何擷取地點 ID。

以下地點詳細資料要求會在 Google 台北 101 地點 ID 的 json 輸出結果中,傳回地址、座標、網站、電話號碼、評分和營業時間:

https://maps.googleapis.com/maps/api/place/details/json?placeid=ChIJraeA2rarQjQRyAqIxkx2vN8&fields=name%2Cformatted_address%2Cwebsite%2Cformatted_phone_number%2Cgeometry/location%2Cicon%2Copening_hours%2Crating&key=YOUR_API_KEY&solution_channel=GMP_guides_enrichedtransactions_v1_a

新增商家地點的地圖

此範例使用:Geocoding API | Maps Static API 同時支援:Android | iOS

判斷商家地點

Maps Static API 接受在地址或座標上放置標記。如果商家記錄已有地址,則可往後跳到下一節 (但為了提高地圖精確度,我們建議您使用座標而非地址)。

如果商家資料庫有街道地址而沒有地理座標,且尚未要求 Place Details,那麼您就可以在伺服器端使用 Geocoding API 將街道地址轉換為經緯度座標,然後將座標儲存在資料庫中,並以至少每 30 天一次的頻率重新整理座標。

以下舉例說明如何使用 Geocoding API 取得 Google 台北辦公室地點 ID 的經緯度:

https://maps.googleapis.com/maps/api/geocode/json?place_id=ChIJraeA2rarQjQRyAqIxkx2vN8&key=YOUR_API_KEY&solution_channel=GMP_guides_enrichedtransactions_v1_a

將商家地點標記加入地圖

使用者會查看地圖確認交易,而不是進行瀏覽或導覽,因此您需要建立互動性有限的地圖。

如果是電腦版和行動版網站,請建立 Maps Static API 網址並將一個標記加到商家的經緯度或地址。您可以透過網路服務呼叫來使用 Maps Static API,如此便會根據您指定的參數來建立圖片版本的地圖。如果是行動裝置,請跳到下一節:在行動應用程式中加入地圖

下列呼叫會顯示尺寸為 640x480 像素的道路圖,以位於 Google 台北辦公室的標記為地圖中心,並使用預設縮放等級。此外,這個呼叫也會指定紅色的送貨地點標記和雲端式地圖樣式設定:

    https://maps.googleapis.com/maps/api/staticmap?size=640x480&markers=color:red%7C25.033976%2C121.5645389&map_id=b224095f76859890&key=YOUR_API_KEY&signature=BASE64_SIGNATURE&solution_channel=GMP_guides_enrichedtransactions_v1_a

此呼叫可分為以下幾個部分:

API 網址 https://maps.googleapis.com/maps/api/staticmap?
圖片大小 size=640x480
商家地點標記 (使用網址編碼) markers=color:red%7C25.033976%2C121.5645389
雲端式地圖樣式設定 map_id=b224095f76859890
API 金鑰 key=YOUR_API_KEY
數位簽章 (瞭解如何數位簽署要求) signature=BASE64_SIGNATURE
解決方案管道參數 (請參閱參數說明文件) solution_channel=GMP_guides_enrichedtransactions_v1_a

顯示的圖片如下所示:

Google 台北辦公室的靜態地圖圖片

您也可以使用地址做為標記位置:

https://maps.googleapis.com/maps/api/staticmap?size=640x480&markers=color:green%7CTaipei%20101%20Tower%2CNo.%207信義路五段信義區台北市%20Taiwan%20110&map_id=b224095f76859890&key=YOUR_API_KEY&signature=BASE64_SIGNATURE&solution_channel=GMP_guides_enrichedtransactions_v1_a

如需其他參數選項,請參閱 Maps Static API 說明文件

在行動應用程式中加入地圖

如果使用 Maps SDK for Android 或 Maps SDK for iOS,便可運用地點詳細資料中的座標放置標記。

使用者會查看地圖確認交易,而不是進行瀏覽或導覽,因此請選用互動性有限的地圖: