Aller au contenu

Prise en main

GitHub

Vous pouvez utiliser notre configuration assistée par IA pour installer le plugin. Ajoutez les skills Capgo à votre outil d'IA avec la commande suivante :

Fenêtre de terminal
bunx skills add https://github.com/Cap-go/capgo-skills --skill capacitor-plugins

Utilisez ensuite le prompt suivant :

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

Si vous préférez une installation manuelle, installez le plugin en exécutant les commandes suivantes et suivez les instructions spécifiques à chaque plateforme ci-dessous :

Fenêtre de terminal
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);
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.
import { Pay } from '@capgo/capacitor-pay';
await Pay.updateApplePayShipping({
selectionId: 'selection-id-123',
paymentSummaryItems: [
{
label: 'Hello from Capacitor',
amount: 'amount',
},
],
});
  • Écouteurs: supprimez les handles lors du démontage des écrans.
  • Sync native : exécuter bunx cap sync après les mises à jour du plugin.
  • Source de vérité : fiez-vous src/definitions.ts au repo GitHub.

Vérifie si le paiement natif est disponible sur la plateforme actuelle. Sur iOS, elle vérifie Apple Pay ; sur Android, Google Pay.

import { Pay } from '@capgo/capacitor-pay';
const result = await Pay.isPayAvailable();
console.log(result);

Affiche la feuille de paiement native de la plateforme actuelle. Fournissez la configuration Apple Pay sur iOS et la configuration Google Pay sur Android.

Cette promesse marque la fin de l'opération sur les deux plateformes.

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.
export interface PayAvailabilityOptions {
apple?: ApplePayAvailabilityOptions;
google?: GooglePayAvailabilityOptions;
}
export interface PayAvailabilityResult {
available: boolean;
platform: PayPlatform;
apple?: ApplePayAvailabilityResult;
google?: GooglePayAvailabilityResult;
}
export interface PayPaymentOptions {
apple?: ApplePayPaymentOptions;
google?: GooglePayPaymentOptions;
}
export type PayPaymentResult = ApplePayRequestPaymentResult | GooglePayRequestPaymentResult;
export interface ApplePayAvailabilityOptions {
/**
* Optional list of payment networks you intend to use.
* Passing networks determines the return value of `canMakePaymentsUsingNetworks`.
*/
supportedNetworks?: ApplePayNetwork[];
}
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;
}
export type PayPlatform = 'ios' | 'android' | 'web';
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;
}
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;
}
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;
}
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;
}
export interface ApplePayRequestPaymentResult {
/**
* Platform that resolved the payment request.
*/
platform: 'ios';
/**
* Apple Pay payment payload.
*/
apple: ApplePayPaymentResult;
}

Cette page est générée à partir de src/definitions.ts. Relancez la synchronisation lorsque l’API public change en amont.

Si vous utilisez Prise en main pour planifier les opérations du dashboard et de API, connectez-l’avec Utiliser @capgo/capacitor-pay pour la fonctionnalité native dans Utiliser @capgo/capacitor-pay, Aperçu de API pour les détails d'implémentation dans « Vue d'ensemble de API », Introduction pour les détails d'implémentation dans l'introduction, Clés API pour les détails d'implémentation dans « Clés API », et Appareils pour les détails d'implémentation dans Devices.