多元化交易實作指南

總覽

網頁 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 當成商家記錄屬性，無限期儲存於資料庫中。每個商家只需執行一次 Find Place 要求。此外，您也可以在每次使用者要求交易明細時搜尋地點 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。

以下 Place Details 要求會在 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，便可依 Place Details 中的座標放置標記。

使用者查看地圖是為了確認交易，而不是要瀏覽或導航，因此請選用互動性有限的地圖：