はじめに

インストール

AIアシストセットアップを使ってプラグインをインストールできます。以下のコマンドで、お使いのAIツールに Capgo スキルを追加してください：

bunx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

次に、以下のプロンプトを使用します：

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

手動セットアップを希望する場合は、以下のコマンドでプラグインをインストールし、下記のプラットフォーム別の手順に従ってください：

bun add @capgo/capacitor-pay
bunx cap sync

インポート

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

クイックスタート

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

const result = await Pay.isPayAvailable();
console.log(result);

例: requestPayment

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

const result = await Pay.requestPayment({
  apple: {
    merchantIdentifier: 'merchant-identifier-123',
    countryCode: 'US',
    currencyCode: 'USD',
    paymentSummaryItems: [
      {
        label: 'Hello from Capacitor',
        amount: 'amount',
      },
    ],
    supportedNetworks: ['AmEx'],
  },
});
// The result holds sensitive values: use it without logging it.

例: updateApplePayShipping

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

await Pay.updateApplePayShipping({
  selectionId: 'selection-id-123',
  paymentSummaryItems: [
    {
      label: 'Hello from Capacitor',
      amount: 'amount',
    },
  ],
});

よくある落とし穴

• リスナー: 画面のアンマウント時にハンドルを削除してください。
• ネイティブ同期: 実行 bunx cap sync プラグインのアップグレード後。
• 信頼できる情報源: 信頼する src/definitions.ts GitHub リポジトリ内に

API の概要

isPayAvailable

現在のプラットフォームでネイティブ決済が利用可能かを確認します。 iOSではApple Pay、AndroidではGoogle Payを判定します。

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

const result = await Pay.isPayAvailable();
console.log(result);

requestPayment

現在のプラットフォームのネイティブ決済シートを表示します。 iOSではApple Payの、AndroidではGoogle Payの設定を指定してください。

このPromiseは、両プラットフォーム共通の完了パスとなります。

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

const result = await Pay.requestPayment({
  apple: {
    merchantIdentifier: 'merchant-identifier-123',
    countryCode: 'US',
    currencyCode: 'USD',
    paymentSummaryItems: [
      {
        label: 'Hello from Capacitor',
        amount: 'amount',
      },
    ],
    supportedNetworks: ['AmEx'],
  },
});
// The result holds sensitive values: use it without logging it.

型リファレンス

PayAvailabilityOptions

export interface PayAvailabilityOptions {
  apple?: ApplePayAvailabilityOptions;
  google?: GooglePayAvailabilityOptions;
}

PayAvailabilityResult

export interface PayAvailabilityResult {
  available: boolean;
  platform: PayPlatform;
  apple?: ApplePayAvailabilityResult;
  google?: GooglePayAvailabilityResult;
}

PayPaymentOptions

export interface PayPaymentOptions {
  apple?: ApplePayPaymentOptions;
  google?: GooglePayPaymentOptions;
}

PayPaymentResult

export type PayPaymentResult = ApplePayRequestPaymentResult | GooglePayRequestPaymentResult;

ApplePayAvailabilityOptions

export interface ApplePayAvailabilityOptions {
  /**
   * Optional list of payment networks you intend to use.
   * Passing networks determines the return value of `canMakePaymentsUsingNetworks`.
   */
  supportedNetworks?: ApplePayNetwork[];
}

GooglePayAvailabilityOptions

export interface GooglePayAvailabilityOptions {
  /**
   * Environment used to construct the Google Payments client. Defaults to `'test'`.
   */
  environment?: GooglePayEnvironment;
  /**
   * Raw `IsReadyToPayRequest` JSON as defined by the Google Pay API.
   * Supply the card networks and auth methods you intend to support at runtime.
   *
   * @see https://developers.google.com/pay/api/android/reference/request-objects#IsReadyToPayRequest
   */
  isReadyToPayRequest?: GooglePayIsReadyToPayRequest;
}

PayPlatform

export type PayPlatform = 'ios' | 'android' | 'web';

ApplePayAvailabilityResult

export interface ApplePayAvailabilityResult {
  /**
   * Indicates whether the device can make Apple Pay payments in general.
   */
  canMakePayments: boolean;
  /**
   * Indicates whether the device can make Apple Pay payments with the supplied networks.
   */
  canMakePaymentsUsingNetworks: boolean;
}

GooglePayAvailabilityResult

export interface GooglePayAvailabilityResult {
  /**
   * Whether the user is able to provide payment information through the Google Pay payment sheet.
   */
  isReady: boolean;
  /**
   * The current user's ability to pay with one or more of the payment methods specified in `IsReadyToPayRequest.allowedPaymentMethods`.
   *
   * This property only exists if `IsReadyToPayRequest.existingPaymentMethodRequired` was set to `true`. The property value will always be `true` if the request is configured for a test environment.
   */
  paymentMethodPresent: boolean | undefined;
}

ApplePayPaymentOptions

export interface ApplePayPaymentOptions {
  /**
   * Merchant identifier created in the Apple Developer portal.
   */
  merchantIdentifier: string;
  /**
   * Two-letter ISO 3166 country code.
   */
  countryCode: string;
  /**
   * Three-letter ISO 4217 currency code.
   */
  currencyCode: string;
  /**
   * Payment summary items displayed in the Apple Pay sheet.
   */
  paymentSummaryItems: ApplePaySummaryItem[];
  /**
   * Card networks to support.
   */
  supportedNetworks: ApplePayNetwork[];
  /**
   * Merchant payment capabilities. Defaults to ['3DS'] when omitted.
   */
  merchantCapabilities?: ApplePayMerchantCapability[];
  /**
   * Contact fields that must be supplied for shipping.
   */
  requiredShippingContactFields?: ApplePayContactField[];
  /**
   * Contact fields that must be supplied for billing.
   */
  requiredBillingContactFields?: ApplePayContactField[];
  /**
   * Controls the shipping flow presented to the user.
   */
  shippingType?: ApplePayShippingType;
  /**
   * Optional ISO 3166 country codes where the merchant is supported.
   */
  supportedCountries?: string[];
  /**
   * Optional opaque application data passed back in the payment token.
   */
  applicationData?: string;

  /**
   * Recurring payment configuration (iOS 16+).
   */
  recurringPaymentRequest?: ApplePayRecurringPaymentRequest;
}

GooglePayPaymentOptions

export interface GooglePayPaymentOptions {
  /**
   * Environment used to construct the Google Payments client. Defaults to `'test'`.
   */
  environment?: GooglePayEnvironment;
  /**
   * Raw `PaymentDataRequest` JSON as defined by the Google Pay API.
   * Provide transaction details, merchant info, and tokenization parameters.
   *
   * @see https://developers.google.com/pay/api/android/reference/request-objects#PaymentDataRequest
   */
  paymentDataRequest: GooglePayPaymentDataRequest;
}

ApplePayRequestPaymentResult

export interface ApplePayRequestPaymentResult {
  /**
   * Platform that resolved the payment request.
   */
  platform: 'ios';
  /**
   * Apple Pay payment payload.
   */
  apple: ApplePayPaymentResult;
}

信頼できる情報源

このページはプラグインの src/definitions.tsから生成されています。上流で公開 API が変更されたら、sync を再実行してください。

Getting Started から続ける

以下を使用している場合： はじめに ダッシュボードと API の操作を計画するには、以下と連携してください @capgo/capacitor-pay の使い方 @capgo/capacitor-pay を使用してネイティブ機能を利用する場合、 API の概要 API Overview の実装の詳細については、 はじめに Introduction の実装の詳細については、 API キー API Keys の実装の詳細については、 デバイス Devices の実装の詳細については。