@ capgo/ 电容器- pay

在您的 Capacitor app 中接受 Apple Pay 和 Google Pay , 使用本地支付表使用 JavaScript API .

🤖 建筑与AI编码代理? 安装 Capgo 技能 所以克劳德代码,代码,光标,副驾驶,或双子座CLI知道如何安装和使用 @capgo/capacitor-pay 在您的电容应用程序中: npx skills add Cap-go/capgo-skills。然后问你的经纪人: 添加@capgo/capacor-pay to my Capacitor app 并连接起来。" 代理设置指南 • 妇女 主机磁共振

主要特点

• 可用性数字 : isPayAvailable() 检查设备能否用您的网络支付.
• 原生表单数字 : requestPayment() 显示 Apple Pay 或 Google Pay, 并返回带有支付数据的结构化结果.
• 苹果支付选项:商号标识,所支持的网络,能力和联系字段.
• 谷歌付费选项:测试或生产环境,卡片网络,和网关或直接标注.
• 平台: iOS和Android. 互联网档案馆的存檔,存档日期2013-12-22. iOS使用PassKit,Android通过Play服务使用Google Pay. 在网上不可用.

文档

这里有最完整的医生: https://capgo.app/docs/plugins/pay/ (中文(简体) )

兼容性

说明: 此插件的主要版本沿用了Capacitor的主要版本. 使用匹配您的 Capacitor 安装的版本( 如 Capacitor 8 的插件 v8) 。 只有最新的主要版本得到积极维护.

安装

您可以使用我们的 AI 辅助设置安装插件 。 使用以下命令将 Capgo 技能添加到您的 AI 工具 :

npx skills add https://github.com/cap-go/capacitor-skills --skill capacitor-plugins

然后使用下列提示:

Use the `capacitor-plugins` skill from `cap-go/capacitor-skills` to install the `@capgo/capacitor-pay` plugin in my project.

如果您更喜欢手动设置,请通过运行以下命令来安装插件,并遵循下面的平台特定指令:

# Install (choose one)
npm install @capgo/capacitor-pay
pnpm add @capgo/capacitor-pay
yarn add @capgo/capacitor-pay
bun add @capgo/capacitor-pay

# Then sync Capacitor (choose one)
npx cap sync
pnpm exec cap sync
yarn cap sync
bunx cap sync

平台设置

在引用插件之前, 填写此寄存器中记录的本地配置 :

• 苹果支付( iOS) : 见 docs/apple-pay-setup.md 用于商家ID创建,证书,Xcode权限,以及设备测试.
• 谷歌付费( Android) : 跟着 docs/google-pay-setup.md 配置商务简介、标识设置和运行时间 JSON 有效载荷.

完成每个应用程序的两条指南,以便在设备上解锁本地付款单.

Google 付费请求和响应类型与此插件捆绑在一起, 因此不需要安装 @types/googlepay 除非你在应用程序的其他地方也使用Google的网络JavaScript客户端.

使用量

import { Pay } from '@capgo/capacitor-pay';

// Check availability on the current platform.
const availability = await Pay.isPayAvailable({
  apple: {
    supportedNetworks: ['visa', 'masterCard', 'amex'],
  },
  google: {
    // Optional: falls back to a basic CARD request if omitted.
    isReadyToPayRequest: {
      apiVersion: 2,
      apiVersionMinor: 0,
      allowedPaymentMethods: [
        {
          type: 'CARD',
          parameters: {
            allowedAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS'],
            allowedCardNetworks: ['AMEX', 'DISCOVER', 'MASTERCARD', 'VISA'],
          },
        },
      ],
    },
  },
});

if (!availability.available) {
  // Surface a friendly message or provide an alternative checkout.
  return;
}

if (availability.platform === 'ios') {
  const result = await Pay.requestPayment({
    apple: {
      merchantIdentifier: 'merchant.com.example.app',
      countryCode: 'US',
      currencyCode: 'USD',
      supportedNetworks: ['visa', 'masterCard'],
      paymentSummaryItems: [
        { label: 'Example Product', amount: '19.99' },
        { label: 'Tax', amount: '1.60' },
        { label: 'Example Store', amount: '21.59' },
      ],
      requiredShippingContactFields: ['postalAddress', 'name', 'emailAddress'],
    },
  });
  console.log(result.apple?.paymentData);
} else if (availability.platform === 'android') {
  const result = await Pay.requestPayment({
    google: {
      environment: 'test',
      paymentDataRequest: {
        apiVersion: 2,
        apiVersionMinor: 0,
        allowedPaymentMethods: [
          {
            type: 'CARD',
            parameters: {
              allowedAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS'],
              allowedCardNetworks: ['AMEX', 'DISCOVER', 'MASTERCARD', 'VISA'],
              billingAddressRequired: true,
              billingAddressParameters: {
                format: 'FULL',
              },
            },
            tokenizationSpecification: {
              type: 'PAYMENT_GATEWAY',
              parameters: {
                gateway: 'example',
                gatewayMerchantId: 'exampleGatewayMerchantId',
              },
            },
          },
        ],
        merchantInfo: {
          merchantId: '01234567890123456789',
          merchantName: 'Example Merchant',
        },
        transactionInfo: {
          totalPriceStatus: 'FINAL',
          totalPrice: '21.59',
          currencyCode: 'USD',
          countryCode: 'US',
        },
      },
    },
  });

  console.log(result.google.paymentData);
  // Process the payment token on your backend server here.
}

经常性付款

Apple Pay 通过 recurringPaymentRequest (iOS 16+):

import { Pay } from '@capgo/capacitor-pay';

await Pay.requestPayment({
  apple: {
    merchantIdentifier: 'merchant.com.example.app',
    countryCode: 'US',
    currencyCode: 'USD',
    supportedNetworks: ['visa', 'masterCard'],
    paymentSummaryItems: [
      { label: 'Pro Plan', amount: '9.99' },
      { label: 'Example Store', amount: '9.99' },
    ],
    recurringPaymentRequest: {
      paymentDescription: 'Pro Plan Subscription',
      managementURL: 'https://example.com/account/subscription',
      regularBilling: {
        label: 'Pro Plan',
        amount: '9.99',
        intervalUnit: 'month',
        intervalCount: 1,
        startDate: Date.now(),
      },
    },
  },
});

Google Pay 在其中没有专门的“ 经常性请求” 对象 PaymentDataRequest。对于订阅,您通常:

1. 和普通人一起收集一个符号 paymentDataRequest。 。 。 .
2. 将其存储在服务器侧并用您的 PSP/出入口(Stripe/Adyen/Braintree/etc) 创建经常性收费.

import { Pay, type GooglePayPaymentDataRequest } from '@capgo/capacitor-pay';

const paymentDataRequest: GooglePayPaymentDataRequest = {
  apiVersion: 2,
  apiVersionMinor: 0,
  allowedPaymentMethods: [
    {
      type: 'CARD',
      parameters: {
        allowedAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS'],
        allowedCardNetworks: ['AMEX', 'DISCOVER', 'MASTERCARD', 'VISA'],
      },
      tokenizationSpecification: {
        type: 'PAYMENT_GATEWAY',
        parameters: {
          gateway: 'example',
          gatewayMerchantId: 'exampleGatewayMerchantId',
        },
      },
    },
  ],
  merchantInfo: {
    merchantId: '01234567890123456789',
    merchantName: 'Example Merchant',
  },
  transactionInfo: {
    totalPriceStatus: 'FINAL',
    totalPrice: '9.99',
    currencyCode: 'USD',
    countryCode: 'US',
  },
};

const result = await Pay.requestPayment({
  google: {
    environment: 'test',
    paymentDataRequest,
  },
});

// Send `result.google.paymentData` to your backend and use your PSP to start the subscription.

requestPayment() 是两个平台上的完成路径.

航运方法(付薪)

过 shippingMethods 让用户选择订单的交付方式,例如家用快递或商店取货。 第一个方法是默认选择的。 当用户更改地址或方法时,工作表会等待到您用 updateApplePayShipping(),通过 selectionId 活动安排。 回答每个事件, 也是当您自己的搜索失败时; 工作表在 20 秒内没有更新, 报告选择失败 。 当方法有不同的金额 applePayShippingMethodSelected 需要听众:

import { Pay } from '@capgo/capacitor-pay';

const deliveryMethods = [
  { identifier: 'home', label: 'Home delivery', amount: '4.95', startDate: '2026-10-16', endDate: '2026-10-17' },
  { identifier: 'store', label: 'Pick up in store', amount: '0.00', detail: 'Ready tomorrow' },
];

await Pay.addListener('applePayShippingContactSelected', async (contact) => {
  // Apple only shares city, postal code and country until the payment is authorized
  // An empty `shippingMethods` array marks the address as unserviceable
  const shippingMethods = await getShippingMethodsFor(contact.postalAddress?.isoCountryCode);
  await Pay.updateApplePayShipping({
    selectionId: contact.selectionId,
    paymentSummaryItems: getSummaryItems(shippingMethods[0]),
    shippingMethods,
  });
});

await Pay.addListener('applePayShippingMethodSelected', async (shippingMethod) => {
  await Pay.updateApplePayShipping({
    selectionId: shippingMethod.selectionId,
    paymentSummaryItems: getSummaryItems(shippingMethod),
  });
});

const result = await Pay.requestPayment({
  apple: {
    merchantIdentifier: 'merchant.com.example.app',
    countryCode: 'NL',
    currencyCode: 'EUR',
    supportedNetworks: ['visa', 'masterCard'],
    requiredShippingContactFields: ['postalAddress', 'name', 'emailAddress'],
    shippingMethods: deliveryMethods,
    paymentSummaryItems: getSummaryItems(deliveryMethods[0]),
  },
});

// `result.apple.shippingMethod` is the method the user selected

API 密码

• isPayAvailable(...)
• requestPayment(...)
• updateApplePayShipping(...)
• addListener('applePayShippingContactSelected', ...)
• addListener('applePayShippingMethodSelected', ...)
• removeAllListeners()
• getPluginVersion()
• 接口
• 类型异名

是PayAvailable (...) (中文(简体) )

isPayAvailable(options?: PayAvailabilityOptions | undefined) => Promise<PayAvailabilityResult>

检查当前平台是否有本地薪酬. 在iOS上,这个评价Apple Pay,在Android上,它评价Google Pay.

回返情况: Promise<PayAvailabilityResult>

请求支付(...)

requestPayment(options: PayPaymentOptions) => Promise<PayPaymentResult>

呈现当前平台的本地薪资表. 在iOS上提供苹果付费配置,在Android上提供谷歌付费配置.

这个承诺是两个平台上的完成路径.

回返情况: Promise<PayPaymentResult>

更新 ApplePayShipping (...)

updateApplePayShipping(options: ApplePayShippingUpdate) => Promise<void>

答复最新数据 applePayShippingContactSelected 或者说 applePayShippingMethodSelected 事件 有新的总数,新的地址有新的运输方法。 仅iOS.

苹果支付表等待这个电话, 所以打电话给它一次 每一次你听 您的搜索失败 。 未在20秒内更新,工作表报告选择失败.

添加倾听器( “ applePayShippingContact Select” ,...)

addListener(eventName: 'applePayShippingContactSelected', listenerFunc: (contact: ApplePayShippingContactSelectedEvent) => void) => Promise<PluginListenerHandle>

当用户选择或更改Apple Pay表中的运货地址时调用. 仅iOS.

在授权支付之前,苹果公司只共享一个被编辑的地址(城市,州,邮政编码和国家). 床单等你打来 updateApplePayShipping()没有收听者,工作表将保留当前总数.

回返情况: Promise<PluginListenerHandle>

添加聆听器( “ applePayShipping Method Select” ,...)

addListener(eventName: 'applePayShippingMethodSelected', listenerFunc: (shippingMethod: ApplePayShippingMethodSelectedEvent) => void) => Promise<PluginListenerHandle>

当用户在Apple Pay平单中选择了另一种传输方法时调用. 仅iOS.

床单等你打来 updateApplePayShipping()没有收听者,工作表保持其当前总数, 因此,当运输方法有不同的金额时,需要这个收听器.

回返情况: Promise<PluginListenerHandle>

删除所有收听器( )

removeAllListeners() => Promise<void>

删除此插件的所有听众 .

获取 PluginVersion ()

getPluginVersion() => Promise<{ version: string; }>

获取本地 Capacitor 插件版本

回返情况: Promise<{ version: string; }>

接口

薪资可偿还性

ApplePayAvail可操作性

GooglePay-Avail可操作性

可选择性

ApplePay 可用性选项

GooglePay 可用性选项

GooglePay is ReadyToPay 请求

基于官方请求对象和绝对Typed定义的自成一体的Google Pay请求类型.

该插件将提供的JSON转发给Android上的本地Google Pay SDK,同时将类型表面保留在本地 所以消费者不需要安装 @types/googlepay。 。 。 .

GooglePay Allowed Payment Method 页面存档备份,存于互联网档案馆 页面存档备份,存于互联网档案馆

GooglePayCardPayment 方法软件

GooglePayBilling Address 算法

GooglePayCard 网络参数

GooglePayGateway 用户化规格

GooglePayPayment Gateway 客户化

切换参数 PAYMENT_GATEWAY 符号化,它将支付数据发送给一个被支持的第三方网关进行符号化和处理.

GooglePayDirectTokenization 规格

GooglePayDirect Tokenization Parameters (英语:GooglePayDirect Tokenization Paremeters) (英语)

GooglePayCusttom 客户化规格

ApplePay 请求支付结果

ApplePayPayment 结果

ApplePay 联系人

ApplePay 测试方法

GooglePay 请求支付结果

GooglePayPayment 付款结果

GooglePayPayment 数据

谷歌付费地址

GooglePayPayment 方法数据

谷歌PayCardInfo 页面存档备份,存于互联网档案馆

GooglePayAssurance 详情

GooglePayPayment MethodTokenization 数据

GooglePayOfferData (英语)

GooglePay 选择选项数据

支付选项

ApplePayPayment 选项

ApplePay 概要项目

ApplePay 重复支付请求

ApplePay 经常支付项目

谷歌付费选项

谷歌 PayPayment 数据请求

基于官方请求对象和绝对Typed定义的自成一体的Google付费请求类型.

该插件将提供的JSON转发给Android上的本地Google Pay SDK,同时将类型表面保留在本地 所以消费者不需要安装 @types/googlepay。 。 。 .