插件
Apple Pay
@nativescript/apple-pay
一个插件,允许你在你的 iOS 应用中提供 Apple Pay。
内容
安装
shell
ns plugin add @nativescript/apple-pay
要求
为了使 Apple Pay 在你的 iOS 应用中正常工作,你需要完成以下步骤。这些步骤也在 Apple PassKit 文档 中概述。
- 创建商户 ID
商户 ID 是你在 Apple 注册的标识符,它唯一地标识你的企业作为能够接受支付的商户。此 ID 永不过期,可用于多个网站和 iOS 应用。请参阅 创建商户标识符 以了解设置步骤。
- 创建支付处理证书
证书与你的商户 ID 关联,用于保护交易数据。Apple Pay 服务器使用证书的公钥加密支付数据。你(或你的支付服务提供商)使用私钥解密数据以处理支付。请参阅 创建支付处理证书 以了解设置步骤。
- 在 Xcode 中启用 Apple Pay。
按照步骤 启用 Apple Pay。
有关展示配置步骤的视频,请参阅:为 Apple Pay 配置你的开发者帐户。
完成 Apple 开发者帐户的配置后,你将能够在你的 iOS 应用中使用 PassKit 框架来实现 Apple Pay。
使用 @nativescript/apple-pay
实现 Apple Pay
要在你的应用中实现 Apple Pay,请按照以下步骤操作
- 注册 Apple Pay 按钮并将其添加到你的页面。
xml
<ios>
<ApplePayBtn
tap="{{ onApplePayTap }}"
buttonType="InStore"
></ApplePayBtn>
</ios>
- 处理按钮的
tap
事件
ts
export class ApplePayViewModel extends Observable {
constructor() {
super()
}
onApplePayTap() {}
}
在点击事件的回调函数(本例中为 onApplePayTap
)中,执行以下操作
- 通过调用
isApplePaySupported()
检查 Apple Pay 是否受支持
ts
import { isApplePaySupported } from '@nativescript/apple-pay'
if (isApplePaySupported()) {
}
- 监听
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 对象),这些数据是从事件中接收到的。
- 如果 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
键 | 值 |
---|---|
ThreeDS | PKMerchantCapability.Capability3DS |
EMV | PKMerchantCapability.CapabilityEMV |
Credit | PKMerchantCapability.CapabilityCredit |
Debit | PKMerchantCapability.CapabilityDebit |
ApplePayMerchantCapaApplePayTransactionStatusbility
键 | 值 |
---|---|
成功 | PKPaymentAuthorizationStatus.Success |
失败 | PKPaymentAuthorizationStatus.Failure |
无效的账单邮政地址 | PKPaymentAuthorizationStatus.InvalidBillingPostalAddress |
无效的送货邮政地址 | PKPaymentAuthorizationStatus.InvalidShippingPostalAddress |
无效的送货联系人 | PKPaymentAuthorizationStatus.InvalidShippingContact |
需要 PIN | PKPaymentAuthorizationStatus.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