Guida rapida
Copia un prompt di setup con i passaggi di installazione e la guida markdown completa per questo plugin.
Set up this Capacitor plugin in the project.
Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-pay`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/pay/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.
Installazione
Sezione intitolata “Install”Puoi usare il nostro Setup assistito dall'AI per installare il plugin. Aggiungi le skill Capgo al tuo tool AI con il comando seguente:
bunx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-pluginsPoi usa questo prompt:
Use the `capacitor-plugins` skill from `Cap-go/capgo-skills` to install the `@capgo/capacitor-pay` plugin in my project.Se preferisci il Setup manuale, installa il plugin eseguendo i comandi seguenti e segui le istruzioni specifiche per piattaforma qui sotto:
bun add @capgo/capacitor-paybunx cap syncImporta
Sezione intitolata “Import”import { Pay } from '@capgo/capacitor-pay';Avvio rapido
Sezione intitolata “Avvio rapido”import { Pay } from '@capgo/capacitor-pay';
const result = await Pay.isPayAvailable();console.log(result);Esempio: requestPayment
Sezione intitolata “Esempio: 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.Esempio: updateApplePayShipping
Sezione intitolata “Esempio: updateApplePayShipping”import { Pay } from '@capgo/capacitor-pay';
await Pay.updateApplePayShipping({ selectionId: 'selection-id-123', paymentSummaryItems: [ { label: 'Hello from Capacitor', amount: 'amount', }, ],});Errori comuni
Sezione intitolata “Errori comuni”- Listener: rimuovi gli handle quando gli screen vengono smontati.
- Sync nativo: esegui
bunx cap syncdopo gli aggiornamenti dei plugin. - Fonte di verità: fidati
src/definitions.tsnel repo GitHub.
API Panoramica
Sezione intitolata “Panoramica API”isPayAvailable
Sezione: “isPayAvailable”Verifica se il pagamento nativo è disponibile sulla piattaforma corrente. Su iOS controlla Apple Pay, su Android controlla Google Pay.
import { Pay } from '@capgo/capacitor-pay';
const result = await Pay.isPayAvailable();console.log(result);requestPayment
Sezione: “requestPayment”Mostra il foglio di pagamento nativo della piattaforma corrente. Fornisci la configurazione di Apple Pay su iOS e quella di Google Pay su Android.
This promise is the completion path on both platforms.
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.Riferimento ai tipi
Sezione intitolata “Riferimento ai tipi”PayAvailabilityOptions
Sezione intitolata “PayAvailabilityOptions”export interface PayAvailabilityOptions { apple?: ApplePayAvailabilityOptions; google?: GooglePayAvailabilityOptions;}PayAvailabilityResult
Sezione intitolata “PayAvailabilityResult”export interface PayAvailabilityResult { available: boolean; platform: PayPlatform; apple?: ApplePayAvailabilityResult; google?: GooglePayAvailabilityResult;}PayPaymentOptions
Sezione intitolata “PayPaymentOptions”export interface PayPaymentOptions { apple?: ApplePayPaymentOptions; google?: GooglePayPaymentOptions;}PayPaymentResult
Sezione intitolata “PayPaymentResult”export type PayPaymentResult = ApplePayRequestPaymentResult | GooglePayRequestPaymentResult;ApplePayAvailabilityOptions
Sezione intitolata “ApplePayAvailabilityOptions”export interface ApplePayAvailabilityOptions { /** * Optional list of payment networks you intend to use. * Passing networks determines the return value of `canMakePaymentsUsingNetworks`. */ supportedNetworks?: ApplePayNetwork[];}GooglePayAvailabilityOptions
Sezione intitolata “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
Sezione intitolata “PayPlatform”export type PayPlatform = 'ios' | 'android' | 'web';ApplePayAvailabilityResult
Sezione intitolata “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
Sezione intitolata “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
Sezione intitolata “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
Sezione intitolata “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
Sezione intitolata “ApplePayRequestPaymentResult”export interface ApplePayRequestPaymentResult { /** * Platform that resolved the payment request. */ platform: 'ios'; /** * Apple Pay payment payload. */ apple: ApplePayPaymentResult;}Fonte di verità
Sezione intitolata “Source Of Truth”Questa pagina è generata dal src/definitions.ts. Riesegui la sync quando il API pubblico cambia upstream.
Continua da Getting Started
Sezione intitolata “Continua da Getting Started”Se stai usando Guida rapida per pianificare dashboard e operazioni API, collegalo a Utilizzando @capgo/capacitor-pay per la funzionalità nativa in @capgo/capacitor-pay, API Panoramica per i dettagli di implementazione in Panoramica di API, Introduzione per i dettagli implementativi nell'Introduzione, Chiavi API per i dettagli implementativi in API Keys, e Dispositivi per i dettagli implementativi in Dispositivi.