8.7 版本发布—WinterCG 合规性第一部分
了解更多

在 GitHub 上查看

@nativescript/apple-pay

一个插件,允许你在你的 iOS 应用中提供 Apple Pay

内容

安装

shell
ns plugin add @nativescript/apple-pay

要求

为了使 Apple Pay 在你的 iOS 应用中正常工作,你需要完成以下步骤。这些步骤也在 Apple PassKit 文档 中概述。

  1. 创建商户 ID

商户 ID 是你在 Apple 注册的标识符,它唯一地标识你的企业作为能够接受支付的商户。此 ID 永不过期,可用于多个网站和 iOS 应用。请参阅 创建商户标识符 以了解设置步骤。

  1. 创建支付处理证书

证书与你的商户 ID 关联,用于保护交易数据。Apple Pay 服务器使用证书的公钥加密支付数据。你(或你的支付服务提供商)使用私钥解密数据以处理支付。请参阅 创建支付处理证书 以了解设置步骤。

  1. 在 Xcode 中启用 Apple Pay。

按照步骤 启用 Apple Pay

有关展示配置步骤的视频,请参阅:为 Apple Pay 配置你的开发者帐户

完成 Apple 开发者帐户的配置后,你将能够在你的 iOS 应用中使用 PassKit 框架来实现 Apple Pay。

使用 @nativescript/apple-pay

实现 Apple Pay

要在你的应用中实现 Apple Pay,请按照以下步骤操作

  1. 注册 Apple Pay 按钮并将其添加到你的页面。
xml
<ios>
    <ApplePayBtn
        tap="{{ onApplePayTap }}"
        buttonType="InStore"
    ></ApplePayBtn>
</ios>
  1. 处理按钮的 tap 事件
ts
export class ApplePayViewModel extends Observable {
  constructor() {
    super()
  }

  onApplePayTap() {}
}

在点击事件的回调函数(本例中为 onApplePayTap)中,执行以下操作

  1. 通过调用 isApplePaySupported() 检查 Apple Pay 是否受支持
ts
import { isApplePaySupported } from '@nativescript/apple-pay'

if (isApplePaySupported()) {
}
  1. 监听 DidAuthorizePaymentHandler(和 AuthorizationDidFinish)事件
ts
applePayBtn.once(
  ApplePayEvents.DidAuthorizePaymentHandler,
  async (args: AuthorizePaymentEventData) => {
    // 1. Send the user payment data to your payments services provider(PSP)
    // 2. Use the response from the PSP to further process your transation, or
    // close the payment sheet
  }
)
  • 当用户授权应用使用他们的支付数据进行支付时,会发出 DidAuthorizePaymentHandler 事件。
  • 调用你的支付服务提供商(Stripe、PayPal 等),发送用户的支付数据和其他交易数据(AuthorizePaymentEventData 对象),这些数据是从事件中接收到的。
  1. 如果 Apple Pay 受支持,请通过在 ApplePayBtn 实例上调用 createPaymentRequest() 方法并向其传递一个 ApplePayRequest 对象来向用户展示支付表格。
ts
const request = {
				paymentItems,
				merchantId: <Your_Apple_Pay_Merchant_ID>, // the merchant ID for this app
				merchantCapabilities: ApplePayMerchantCapability.ThreeDS,
				countryCode: 'US',
				currencyCode: 'USD',
				shippingContactFields: [ApplePayContactFields.Name, ApplePayContactFields.PostalAddress],
				billingContactFields: [ApplePayContactFields.Name, ApplePayContactFields.PostalAddress],
				supportedNetworks: [ApplePayNetworks.Amex, ApplePayNetworks.Visa, ApplePayNetworks.Discover, ApplePayNetworks.MasterCard],
			} as ApplePayRequest;

await applePayBtn.createPaymentRequest(request).catch((err) => {
				console.log('Apple Pay Error', err);
			  });

在此处找到完整的代码 此处

API

ApplePayBtn

用于启动并完成 Apple Pay 支付的视图。

方法描述
createPaymentRequest(request: ApplePayRequest)创建 Apple Pay 支付请求,并向用户展示支付表格。

枚举

ApplePayEvents

描述
DidAuthorizePaymentHandler告诉委托用户已授权支付请求,并要求结果。有关事件数据,请参阅 AuthorizePaymentEventData
AuthorizationDidFinish告诉委托支付授权已完成。有关事件数据,请参阅 AuthorizationDidFinishEventData

ApplePayContactFields

描述
EmailAddress表示电子邮件地址字段。
Name表示姓名字段。
PhoneNumber表示电话号码字段。
PhoneticName表示音标姓名字段。
PostalAddress表示邮寄地址字段。

ApplePayNetworks

Amex
CarteBancaire
CarteBancaires
中国银联
Discover
Eftpos
Electron
Elo
IDCredit
Interac
Jcb
Mada
Maestro
万事达卡
PrivateLabel
QuicPay
Suica
Visa
VPay

ApplePayMerchantCapability

ThreeDSPKMerchantCapability.Capability3DS
EMVPKMerchantCapability.CapabilityEMV
CreditPKMerchantCapability.CapabilityCredit
DebitPKMerchantCapability.CapabilityDebit

ApplePayMerchantCapaApplePayTransactionStatusbility

成功PKPaymentAuthorizationStatus.Success
失败PKPaymentAuthorizationStatus.Failure
无效的账单邮政地址PKPaymentAuthorizationStatus.InvalidBillingPostalAddress
无效的送货邮政地址PKPaymentAuthorizationStatus.InvalidShippingPostalAddress
无效的送货联系人PKPaymentAuthorizationStatus.InvalidShippingContact
需要 PINPKPaymentAuthorizationStatus.PINRequired
PIN 错误PKPaymentAuthorizationStatus.PINIncorrect
PIN 锁定PKPaymentAuthorizationStatus.PINLockout,

ApplePayPaymentItemType

最终PKPaymentSummaryItemType.Final
待定PKPaymentSummaryItemType.Pending

ApplePayButtonType

普通PKPaymentButtonType.Plain
购买PKPaymentButtonType.Buy
预订PKPaymentButtonType.Book
结账PKPaymentButtonType.Checkout
捐赠PKPaymentButtonType.Donate
店内PKPaymentButtonType.Book
订阅PKPaymentButtonType.Subscribe

ApplePayButtonStyle

白色PKPaymentButtonStyle.White
白色边框PKPaymentButtonStyle.WhiteOutline
黑色PKPaymentButtonStyle.Black

接口

ApplePayRequest

ts
interface ApplePayRequest {
  paymentItems: Array<ApplePayItems>
  merchantId: string // the merchant ID for this app
  merchantCapabilities: number
  countryCode: string
  currencyCode: string
  supportedNetworks: Array<ApplePayNetworks>
  billingContactFields?: Array<ApplePayContactFields>
  shippingContactFields?: Array<ApplePayContactFields>
  shippingMethods?: Array<ApplePayShippingMethods>
}

ApplePayItems

ts
interface ApplePayItems {
  label: string
  amount: number
  type: ApplePayPaymentItemType
}

AuthorizePaymentEventData

DidAuthorizePaymentHandler 事件返回的数据。

ts
interface AuthorizePaymentEventData extends EventData {
  eventName: string
  object: any
  data?: {
    payment: PKPayment
    token: PKPaymentToken
    paymentData: ApplePayPaymentData
    billingAddress
    billingContact: PKContact
    shippingAddress
    shippingContact: PKContact
    shippingMethod: PKShippingMethod
  }
  completion: (status: ApplePayTransactionStatus) => void
}

AuthorizationDidFinishEventData

AuthorizationDidFinish 事件返回的数据。

ts
interface AuthorizationDidFinishEventData extends EventData {
  eventName: string
  object: any
}

ApplePayPaymentData

ts
interface ApplePayPaymentData {
  /**
   * Encrypted payment data.
   */
  data

  /**
   * Additional version-dependent information used to decrypt and verify the payment.
   */
  header

  /**
   * Signature of the payment and header data. The signature includes the signing certificate, its intermediate CA certificate, and information about the signing algorithm.
   */
  signature

  /**
   * Version information about the payment token.
   * The token uses EC_v1 for ECC-encrypted data, and RSA_v1 for RSA-encrypted data.
   */
  version: string
}

许可证

Apache 许可证 2.0 版

上一个
Zip
下一个
Google Pay