iOS 平台上的 Apple Pay 實作

在手機 App 上常會有許多的消費行為,根據消費內容對應的付款工具也有所不同。

Stefan Ng
Begonia Design 海棠設計
6 min readJul 16, 2021

--

在 App 中常見的付款方式主要有信用卡與 In-App Purchase兩種方式,Apple 也有訂出 Guideline 說明兩種付款方式的使用時機,簡單判斷方式如下:當商品是與 App 服務相關的內容,像是解除廣告、遊戲點數或是影音訂閱,則必須使用 In-App Purchase;若在現實世界中才能使用的項目且跟目前 App 無關的商品,例如:電子票券、實體商品,就要使用 Apple Pay 或是傳統的信用卡方式。

Apple Pay 的付款流程

依據官方文件,一次的 Apple Pay 付款完成需要以下幾個角色:

Customer 使用者

Merchant 電商的伺服器

Payment Service Provider 金流供應商

Card Network 發卡組織

Bank Issuer 授權銀行

付款流程

在 iOS 上利用是 Apple 用神奇的黑魔法演算法產生安全的加密內容 token,並依據此 token 進行交易。

  1. 使用者 Apple Pay 付款按鈕
  2. 取得 Apple 產生的 Payment Token
  3. 傳送 Payment Token 至後端伺服器(Merchant)
  4. 後端伺服器傳送 Payment Token 給金流供應商
  5. 透過金流供應商向銀行處理支付流程
  6. 金流供應商透過後端伺服器(Merchant) 回傳支付結果
  7. 回應在 Apple Pay 頁面呈現結果

按鈕風格

必須使用 Apple 提供的按鈕,不能自行創建按鈕,Apple 提供了許多類型的按鈕,可自行使用對應的按鈕形式,在文件內有完整說明

Apple 按鈕風格

支援平台

iPhone 6 以上

也可以用 function 判斷要不要出現 Apple Pay 按鈕

檢查 Apple Pay 是否可使用

設定 Apple Pay 專案

  1. 在開發者後台建立一個 Merchant IDs
建立 Merchant IDs

2. 編輯剛創建的 Merchant ID,一開始兩個憑證會是空的

建立 Payment 憑證

2–1. 建立 Apple Pay Payment Processing Certificate 需要 ECC 256-bit 的 CSR 檔案

2–2. 建立 Apple Pay Merchant Identity Certificate 需要 RSA 2048-bit 的 CSR 檔案

2–3. 若要支援 網頁版的 Apple Pay 則也要設定 Merchant Domains

3. 編輯 App ID 的 Apple Pay Payment Processing 選取建立的 Merchant ID

App ID 設定

4. 設定 Xcode 專案的 Capability

Xcode Project Capability 設定

Merchant IDs 選取剛剛建立的 Merchant ID

新增測試者

1. 建立一組 Sandbox 測試用 iCloud 帳號

建立 Sandbox 測試人員

2. 將 iCloud 登入測試的帳號,開啟 Wallet 後會顯示 Sandbox 字樣

Wallet 測試卡片

一開始 Wallet 會是空的,需要手動加入測試信用卡,測試用的信用卡號可參閱 Sandbox Testing

程式實作

在 iOS 上要實現 Apple Pay 需要透過 PassKit,付款畫面可以支援多種方式的款項組合。

以下例子為:購買 50 杯大杯珍奶,使用任意門運送,共 5700元

經由 PKPaymentAuthorizationController 顯示付款視窗

處理 PKPaymentAuthorizationController 的 Call Back 需要實作PKPaymentAuthorizationControllerDelegate

處理 PKPaymentAuthorizationControllerDelegate
  1. 使用者完成 Apple Pay 授權後,會呼叫 paymentAuthorizationController(_:didAuthorizePayment:handler:),藉由呼叫 completion(_) 決定付款視窗的結果。
  2. 完成後需要在 paymentAuthorizationControllerDidFinish(_:) 關閉付款視窗,當驗證完成或是失敗都會呼叫此 Delegate,付款視窗並不會自動消失。
付款視窗情境示意

目前執行到這裡並不會任何付款送出,只有在 App 端的 Apple Pay 視窗執行流程;若要串接金流則要在完成 Apple Pay 驗證的 Delegate 地方將 Payment Token 回傳給後端伺服器,在串給金流供應商,下面範例為串接綠界的金流,綠界提供的範例為 Objective-C,以下用 Swift 實作

串接綠界金流

目前台灣已有許多金流供應商支援 Apple Pay,在 Apple 上可以查到台灣區目前支援 Apple Pay 的金流服務供應商 (Payment Service Provider) :

PassKit 還有提供許多的操作功能,例如在付款畫面提示各種 Error 狀態像是訂單地址錯誤、聯絡人資訊錯誤、帳單位址錯誤,參考PKPaymentRequest

錯誤狀態設定

如果需要實作 Safari 網頁版本需要使用 Apple Pay JS 配合後端伺服器,才能取得 Payment Token,詳細作法可參閱 Apple Pay on the Web
Interactive Demo

參考資料

Apple Pay Human Interface Guidelines

PassKit

In-App Purchase

--

--