What's new in Wallet and Apple Pay

ハイライト

iOS 15 の Apple Pay 支払いシートは SwiftUI で完全に書き直され、クーポンコード、出荷日範囲、読み取り専用の配送先住所などの API が追加されています。ウォレットは、複数のパスの一括ダウンロードと期限切れのパスの自動非表示をサポートしています。

主な内容

あなたは電子商取引アプリを構築しています。ユーザーが製品を選択し、クリックして購入すると、Apple Pay の支払いシートがポップアップします。このプロセスはすでに iOS 14 で実行できますが、いくつかの問題点があります。

ユーザーが割引コードの入力を忘れた場合、支払いをキャンセルし、ショッピングカートに戻り、割引コードを入力して支払いを再開することしかできません。
配達時間についてはテキストによる説明のみを入力でき、正確な日付範囲を表示することはできません。・受取先住所と配送先住所が混在しており、ユーザーが誤って変更してしまう可能性があります。

iOS 15 の Apple Pay では、支払いシートが再設計され、SwiftUI でボトムアップで書き直され、これらの問題点を解決するために多数の新しい API が追加されました。

ウォレットも更新されました。一度に複数のパスをダウンロードできるようになり、期限切れのチケットは自動的に非表示になり、ユーザーのウォレットが乱雑になることはなくなりました。

＃＃詳細

マルチパス一括ダウンロード

（01:39）

以前は、Web ページからパスを追加する場合、一度に追加できるパスは 1 つだけでした。iOS 15 はバッチダウンロードをサポートしています。

1.複数置く.pkpassファイルはzipにパッケージ化されています 2. ファイル拡張子を次のように変更します。.pkpasses 3. MIME タイプを次のように設定します。application/vnd.apple.pkpasses

ユーザーがダウンロードリンクをクリックすると、ウォレットはすべてのパスを一度に処理します。

キーポイント:

映画チケット、コンサートチケットなどの複数のシナリオに適しています。
ファイル形式と MIME タイプを変更するだけで済み、サーバーロジックは変更されません。

期限切れのパスは自動的に非表示になります

（02:28）

ウォレットは、インターフェースをクリーンに保つために期限切れのパスを自動的に非表示にするようになりました。判定ロジックは次の 3 つのフィールドに基づいています。

expirationDate現在の日付より前の日付
relevantDate現在の日付より 1 日以上前
voidedに設定されていますtrue

キーポイント:

これら 3 つのパスのフィールドが正しく設定されていることを確認してください
ユーザーは引き続き「期限切れ」カテゴリで隠しパスを見つけることができます
古いパスを手動で削除するのをユーザーに依存しないでください

支払いシートの新しいデザイン

（05:04）

iOS 15 の Apple Pay シートは SwiftUI で完全に書き直され、より明確なビジョンとよりスムーズなインタラクションを実現しました。具体的な改善点:

新規ユーザーがカードとアドレスを追加するための簡素化されたプロセス
古いユーザーは、ジャンプせずに支払いシートに新しいカードを直接追加できます。
エラーメッセージがよりわかりやすく再設計されました
製品の詳細、割引、小計を表示するための概要ビューを追加しました
概要ビューにアプリケーションのアイコンが表示されるようになりました (Web 決済では Web Clip アイコンが表示されます)

キーポイント:

新しい設計は、コードを変更しなくても自動的に有効になります。
Web 決済用の Web Clip アイコンを設定することをお勧めします (2x および 3x、Web サイトのルートディレクトリに配置)
iOS 15 の通知アイコンが大きくなり、PKPass アイコンには少なくとも 38x38 @1x が必要です

発送日の範囲

（07:40）

新しいdateComponentsRange属性を使用すると、支払いシートに正確な配達時間または集荷時間を表示できます。

let shippingMethod = PKShippingMethod(
    label: "标准快递",
    amount: 10.00
)

let calendar = Calendar.current
let today = Date()
let shippingStart = calendar.date(byAdding: .day, value: 3, to: today)!
let shippingEnd = calendar.date(byAdding: .day, value: 7, to: today)!

shippingMethod.dateComponentsRange = PKDateComponentsRange(
    start: calendar.dateComponents([.year, .month, .day], from: shippingStart),
    end: calendar.dateComponents([.year, .month, .day], from: shippingEnd)
)

キーポイント:

使用DateComponentsシンプルというよりもDate、組み込みのタイムゾーンとカレンダーのサポート・「3～7日でお届け予定」または「明日14時までに受取可能」の表示が可能です。
Web バージョンの Apple Pay には、対応する JavaScript API があります

読み取り専用の配送先住所

（09:36）

セルフピックアップのシナリオでは、住所は固定されており (特定の店舗など)、ユーザーによる変更は許可されるべきではありません。iOS 15 は読み取り専用アドレスの設定をサポートしています。

let address = CNMutablePostalAddress()
address.street = "1 Infinite Loop"
address.city = "Cupertino"
address.state = "CA"
address.postalCode = "95014"

let contact = PKContact()
contact.postalAddress = address

paymentRequest.shippingContact = contact
paymentRequest.shippingType = .storePickup
paymentRequest.shippingContactEditingMode = .enabled
paymentRequest.requiredShippingContactFields = [.postalAddress]

キーポイント:

shippingContactEditingModeに設定.enabled、ユーザーに表示されるアドレスは読み取り専用です
セルフピックアップ、固定ピックアップポイント、その他のシナリオに適しています
Web版合格shippingContactEditingModeフィールドでも同じ効果が得られます

クーポンコード

（10:46）

ユーザーは、支払いプロセスをキャンセルせずに、割引コードを支払いシートに直接入力できます。実装方法：

// 启用优惠券支持
paymentRequest.supportsCouponCode = true
paymentRequest.couponCode = "WELCOME10" // 可选：预填充

// 处理优惠码变更
default func paymentAuthorizationController(
    _ controller: PKPaymentAuthorizationController,
    didChangeCouponCode couponCode: String,
    handler: @escaping (PKPaymentRequestCouponCodeUpdate) -> Void
) {
    if couponCode == "FESTIVAL" {
        // 有效优惠码，更新总价
        let updatedItems = applyDiscount(couponCode)
        handler(PKPaymentRequestCouponCodeUpdate(
            paymentSummaryItems: updatedItems
        ))
    } else if couponCode.isEmpty {
        // 空码，恢复原价
        handler(PKPaymentRequestCouponCodeUpdate(
            paymentSummaryItems: originalItems
        ))
    } else {
        // 无效优惠码，显示错误
        let error = PKPaymentRequest.paymentCouponCodeInvalidError(
            withLocalizedDescription: "优惠码无效"
        )
        handler(PKPaymentRequestCouponCodeUpdate(
            errors: [error],
            paymentSummaryItems: originalItems,
            shippingMethods: shippingMethods
        ))
    }
}

キーポイント:

supportsCouponCode = trueイネーブル機能
使用didChangeCouponCodeデリゲートメソッドのリアルタイム検証
供給paymentCouponCodeInvalidErrorそしてpaymentCouponCodeExpiredError2 種類のエラー
ユーザー入力を減らすために、既知の有効な割引コードを事前に入力することをお勧めします。

新しい JavaScript 支払いボタン

（04:23）

Web 上の Apple Pay には、現在のすべてのボタンのタイプとスタイルをサポートする新しい純粋な JavaScript 支払いボタンが追加されます。

const button = document.createElement('apple-pay-button');
button.setAttribute('buttonstyle', 'black');
button.setAttribute('type', 'plain');
button.setAttribute('locale', 'zh-CN');

キーポイント:

ボタンのサイズとスタイルはカスタマイズ可能
スタイルの接頭辞は次のとおりです。apple-pay-
既存のすべてのボタンタイプ (購入、寄付、セットアップなど) をサポートします。

重要ポイント

支払いシートに入力したクーポンを e コマースアプリに追加します。割引コードの入力を忘れることは、ショッピングカートが放棄される主な理由の 1 つです。iOS15supportsCouponCodeユーザーが支払いプロセスを離れることなく入力を完了できるようにします。入口API:PKPaymentRequest.supportsCouponCode + PKPaymentAuthorizationControllerDelegate.didChangeCouponCode。
正確な配送時間範囲を表示。「3 ～ 5 日以内に発送予定」は、「できるだけ早く発送する」よりもユーザーの信頼を築きます。使用PKDateComponentsRange開始日と終了日を設定すると、支払いシートが自動的にフォーマットされて表示されます。入口API:PKShippingMethod.dateComponentsRange。
ピックアップシナリオに読み取り専用アドレスを設定します。ユーザーが店頭受け取りを選択した場合は、支払いシートの住所を変更させないでください。使用shippingContact + shippingContactEditingModeアドレスをロックします。入口API:PKPaymentRequest.shippingContact + .shippingContactEditingMode。
イベントチケットをバッチで発行。音楽フェスティバル、映画、展覧会などのチケットを一度に複数枚発行します。バンドル.pkpassファイルは以下にパッケージ化されています.pkpasses、ユーザーはすべてのチケットを一度にダウンロードします。入口API：zip+.pkpasses拡張子+application/vnd.apple.pkpasses MIME type。
Web クリップアイコンを設定して Web 支払いの信頼性を高めます。Web バージョンの Apple Pay では、支払いシートに Web サイトのアイコンが表示されるようになりました。120x120 および 180x180 のアイコンを Web サイトのルートディレクトリに配置すると、Apple Pay がそれらを自動的に取得します。入口API:<link rel="apple-touch-icon">またはルートディレクトリapple-touch-icon.png。

What's new in Wallet and Apple Pay

ハイライト

主な内容

マルチパス一括ダウンロード

期限切れのパスは自動的に非表示になります

支払いシートの新しいデザイン

発送日の範囲

読み取り専用の配送先住所

クーポンコード

新しい JavaScript 支払いボタン

重要ポイント

関連セッション

コメント