Suivez les étapes de ce tutoriel pour intégrer une application Web à l'API Google Pay et la configurer pour accepter les cartes de paiement.
- Étape 1 : Définissez votre version de l'API Google Pay.
- Étape 2 : Choisissez une méthode de tokenisation des paiements.
- Étape 3 : Définissez les réseaux de cartes de paiement acceptés.
- Étape 4 : Décrivez vos modes de paiement autorisés.
- Étape 5 : Chargez la bibliothèque JavaScript de l'API Google Pay.
- Étape 6 : Déterminez l'aptitude à payer avec l'API Google Pay.
- Étape 7 : Ajoutez un bouton de paiement Google Pay.
- Étape 8 : Créez un objet PaymentDataRequest.
- Étape 9 : Enregistrez un gestionnaire d'événements pour les gestes de l'utilisateur.
- Étape 10 (facultative) : Configurez Authorize Payments.
- Étape 11 (facultative si la livraison est activée) : Configurez les mises à jour dynamiques des prix.
- Étape 12 (facultative pour les codes promotionnels) : Configurez les codes promotionnels.
Étape 1 : Définissez la version de votre API Google Pay
Déclarez la version de l'API Google Pay utilisée par votre site. Les versions majeure et mineure sont requises dans les champs de chaque objet transmis et sont incluses dans la réponse.
L'exemple de code suivant montre les versions d'API déclarées :
const baseRequest = { apiVersion: 2, apiVersionMinor: 0 };
Étape 2 : Demandez un jeton de paiement à votre fournisseur de services de paiement
Google chiffre les informations sur la carte sélectionnée par le payeur pour un traitement sécurisé par un fournisseur de services de paiement.
const tokenizationSpecification = { type: 'PAYMENT_GATEWAY', parameters: { 'gateway': 'example', 'gatewayMerchantId': 'exampleGatewayMerchantId' } };
Remplacez example et exampleGatewayMerchantId par les valeurs appropriées pour votre fournisseur de paiement. Utilisez le tableau suivant pour trouver les valeurs spécifiques de gateway et gatewayMerchantId pour votre fournisseur de paiement :
| Passerelle | Paramètres et documents |
|---|---|
| 9Pay |
"gateway": "ninepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ABA PayWay |
"gateway": "ababank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| accept.blue |
"gateway": "acceptblue" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ACI |
"gateway": "aciworldwide" "gatewayMerchantId": "YOUR_ENTITY_ID" |
| ACpay |
"gateway": "acpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Acquired.com |
"gateway": "acquired" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Adyen |
"gateway": "adyen" "gatewayMerchantId": "YOUR_MERCHANT_ACCOUNT_NAME" |
| Fintech et IA |
"gateway": "aifintech" "gatewayMerchantId": "YOUR_MERCHANT_ACCOUNT_NAME" |
| Airba Pay |
"gateway": "airbapay"" "gatewayMerchantId": "YOUR_MERCHANT_ACCOUNT_NAME" |
| Airvend |
"gateway": "airvend" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Airwallex |
"gateway": "airwallex" "gatewayMerchantId": "YOUR_MERCHANT_ACCOUNT_NAME" |
| Akurateco |
"gateway": "akuratecolab" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Alfa-Bank |
"gateway": "alfabank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Algoritma |
"gateway": "algoritma" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Allinpay |
"gateway": "allinpayintl" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| AllPayments |
"gateway": "allpayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| alticepay |
"gateway": "alticepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| AMO FINTECH LLC |
"gateway": "amofintech" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Amwal Pay |
"gateway": "amwalalraqamia" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| Anedot |
"gateway": "anedot" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ApcoPay |
"gateway": "apcopay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| APPEX |
"gateway": "epos" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| AsiaBill |
"gateway": "asiabill" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| Assistance |
"gateway": "assist" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Aider la Biélorussie |
"gateway": "belassist" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Assist Kazakhstan |
"gateway": "assistkz" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Aurus |
"gateway": "auruspay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Authorize.net |
"gateway": "authorizenet" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Axerve |
"gateway": "gestpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| azericardgpay |
"gateway": "azericardgpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| B2B Soft Pay |
"gateway": "b2bsoftpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Banque 131 |
"gateway": "bank131" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| BANK RBK |
"gateway": "bankrbkkzpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Bank Vostok |
"gateway": "bankvostok" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Barclaycard |
"gateway": "barclayssmartpayadvance" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Barion |
"gateway": "barion" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Basis Theory |
"gateway": "basistheory" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| BCC.KZ |
"gateway": "bccpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| bePaid |
"gateway": "ecomcharge" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Bereke Bank |
"gateway": "berekepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Systèmes de facturation |
"gateway": "billingsystems" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Bindo Labs Limited |
"gateway": "bindo" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| bisys.kz |
"gateway": "bisysgpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Bizzon |
"gateway": "bizzon" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Blocs |
"gateway": "blocks" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Bluefin |
"gateway": "bluefin" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Bluefin Europe |
"gateway": "bluefineurope" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Blue Media |
"gateway": "bluemedia" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| BlueSnap |
"gateway": "bluesnap" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| BORICA |
"gateway": "borica" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| BPC |
"gateway": "bpcpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| BR-DGE |
"gateway": "comcarde" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Braintree |
"gateway": "braintree" "braintree:apiVersion": "v1" "braintree:sdkVersion": "braintree.client.VERSION" "braintree:merchantId": "YOUR_BRAINTREE_MERCHANT_ID" "braintree:clientKey": "YOUR_BRAINTREE_TOKENIZATION_KEY" |
| Braspag |
"gateway": "cielo" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| BridgerPay |
"gateway": "bridgerpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| BT Pay |
"gateway": "btpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Buckaroo |
"gateway": "buckaroo" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Buya |
"gateway": "buya" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CardCom |
"gateway": "cardcom" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CardConnect |
"gateway": "cardconnect" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Cardknox |
"gateway": "cardknox" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| cardlink |
"gateway": "cardlink" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Cardstream |
"gateway": "crst" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Flux de trésorerie |
"gateway": "cashflowsgateway" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Cathay United Bank |
"gateway": "cathaybk" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CCAvenue UAE |
"gateway": "ccavenueuae" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CCV |
"gateway": "ccv" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Cecabank |
"gateway": "cecabank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Celerispay |
"gateway": "celerispay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CentralPay |
"gateway": "centralpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Chargehive |
"gateway": "chargehive" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CharityEngine |
"gateway": "charityengine" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Chase Merchant Services |
"gateway": "chase" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Checkout.com |
"gateway": "checkoutltd" "gatewayMerchantId": "YOUR_PUBLIC_KEY" |
| CityPay |
"gateway": "citypay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Passerelle de paiement Cloud9 (C9PG) |
"gateway": "c9pg" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CloudPayments |
"gateway": "cloudpayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CloudWalk |
"gateway": "cloudwalk" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Coinflow |
"gateway": "coinflow" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Computop |
"gateway": "computop" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ConcordPay |
"gateway": "concordpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Connectum |
"gateway": "connectum" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ConnexPay |
"gateway": "connexpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CoralPay |
"gateway": "coralpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Corefy |
"gateway": "paycoreio" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Corvus Pay |
"gateway": "corvuspay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Credorax |
"gateway": "credorax" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CrossPay |
"gateway": "crosspay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Cross Switch |
"gateway": "crossswitch" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CSG Forte |
"gateway": "csgforte" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CTBC Bank |
"gateway": "ctbcbank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CURO Payments |
"gateway": "curopayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| CYBERBIZ |
"gateway": "cyberbizpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Cybersource |
"gateway": "cybersource" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| danube.pay |
"gateway": "danubepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Datacap Systems, Inc. |
"gateway": "datatrans" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Datatrans |
"gateway": "datatrans" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| DECTA |
"gateway": "decta" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs |
| Dejavoo |
"gateway": "denovosystempay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| DEUNA |
"gateway": "deuna" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Deutsche Bank AG |
"gateway": "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs |
| Deutsche Bank – Merchant Solutions |
"gateway": "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| DG Financial Technology, Inc. |
"gateway": "veritrans" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Finance numérique |
"gateway": "digitalfinance" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Dintero |
"gateway": "dintero" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| dLocal |
"gateway": "dlocal" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| DNA Payments |
"gateway": "dnapayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Dojo |
"gateway": "dojo" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Dotpay |
"gateway": "dotpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| e-SiTef – Software Express |
"gateway": "softwareexpress" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| easycard |
"gateway": "easycard" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| EasyPay |
"gateway": "easypay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Easypay EU |
"gateway": "easypaypt" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| EBANX |
"gateway": "ebanx" "gatewayMerchantId": "YOUR_PUBLIC_INTEGRATION_KEY" |
| eCard |
"gateway": "ecard" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ECOMMPAY |
"gateway": "ecommpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Ecopaynet |
"gateway": "ecopaynet" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ECPay |
"gateway": "ecpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| eftcorporation |
"gateway": "eftcorporation" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| eGHL |
"gateway": "eghl" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Elavon (Converge) |
"gateway": "convergepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Emerchantpay |
"gateway": "emerchantpay" "gatewayMerchantID": "YOUR_GATEWAY_MERCHANT_ID" |
| emspay |
"gateway": "emsonline" "gatewayMerchantID": "YOUR_GATEWAY_MERCHANT_ID" |
| Encodé |
"gateway": "encoded" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| epay |
"gateway": "epay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| EPAYJSC |
"gateway": "epayjsc" "gatewayMerchantID": "YOUR_GATEWAY_MERCHANT_ID" |
| EpicPay |
"gateway": "epicpay" "gatewayMerchantID": "YOUR_GATEWAY_MERCHANT_ID" |
| Espago |
"gateway": "espago" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Etisalat |
"gateway": "etisalatpaymentgateway" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| EveryPay S.A. |
"gateway": "EveryPay S.A." "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Evervault |
"gateway": "evervault" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| EVONET |
"gateway": "cardinfolink" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| EVOPAY |
"gateway": "EVOPAY" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Passerelle de paiement Evo |
"gateway": "evopaymentgateway" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| exactly.com |
"gateway": "exactly" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Exact Payments |
"gateway": "exactpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Fat Zebra |
"gateway": "fatzebra" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Fenige |
"gateway": "fenige" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Fexco payUnite |
"gateway": "fexco" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Fibonatix |
"gateway": "fibonatixparagon" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Ligne financière |
"gateway": "finline" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Finanso UA |
"gateway": "finansoua" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| fincode byGMO |
"gateway": "fincode" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| FINEXUS |
"gateway": "finexus" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Finix |
"gateway": "finix" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| First American by Deluxe |
"gateway": "firstpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Fiuu (anciennement Razer Merchant Services et MOLPay) |
"gateway": "molpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| FIS Biller Solutions |
"gateway": "fisglobalbsp" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Fiserv |
"gateway": "fiserv" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Fiserv |
"gateway": "fiservipg" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Flitt |
"gateway": "flitt" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Fluid Pay |
"gateway": "fluidpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| FM Finance LTD |
"gateway": "fmfinanceltd" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ForteBank |
"gateway": "fortebank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Fractal |
"gateway": "fractal" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Freedom Finance Bank |
"gateway": "axayscom" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| FreedomPay |
"gateway": "freedompay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| FreedomPay.Money |
"gateway": "payboxmoney" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Freepay |
"gateway": "freepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Frontstream |
"gateway": "frontstreampayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Fung Payments |
"gateway": "fungpayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| GBPayments |
"gateway": "gbpayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| geidea |
"gateway": "geidea" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| GETTRX |
"gateway": "globalelectronictechnology" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Global One Pay |
"gateway": "globalonepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| Global Payments |
"gateway": "globalpayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| globalpaymentsinc |
"gateway": "globalpaymentsinc" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| GMO Payment Gateway |
"gateway": "gmopg" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| GoDaddy Payments |
"gateway": "godaddypayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Good Idea Technologies |
"gateway": "git" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| GoPay |
"gateway": "gopay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| GP Webpay |
"gateway": "gpwebpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| Gravity Payments |
"gateway": "gravitypayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Gr4vy |
"gateway": "gr4vy" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Halyk Bank |
"gateway": "halykbank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Helcim |
"gateway": "helcim" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| HIPS |
"gateway": "hips" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| HITRUST |
"gateway": "hitrustpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| hutko |
"gateway": "hutko" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Hyp |
"gateway": "hyp" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| icard |
"gateway": "icardwallet" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| iCount |
"gateway": "iCount" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| IDid Tecnologia Ltda |
"gateway": "idid" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| iKhokha |
"gateway": "ikhokha" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| IMOJE |
"gateway": "imoje" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Impaya |
"gateway": "impayarus" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Inovio Payments |
"gateway": "inoviopay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| InPlat |
"gateway": "inplat" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| InstaMed |
"gateway": "instamed" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| IntaSend Solutions Limited |
"gateway": "intasend" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| IntellectMoney |
"gateway": "intellectmoney" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Solutions de transactions interactives |
"gateway": "interactivets" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Galerie de paiement Interswitch |
"gateway": "interswitch" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Intervale |
"gateway": "intervale" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ioka fintech |
"gateway": "ioka" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| iPay88 |
"gateway": "ipay88" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| IPSI |
"gateway": "ipsi" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| iQmetrix |
"gateway": "iqmetrixpaymentservicesgateway" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| IXOPAY |
"gateway": "ixopay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| JetPay |
"gateway": "jetpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| JudoPay |
"gateway": "judopay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| KapitalBank |
"gateway": "eCommerceKapitalBank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Kassa |
"gateway": "kassacom" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| kassa24pay |
"gateway": "kassa24pay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Kineox |
"gateway": "kineox" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Klix by Citadele |
"gateway": "klix" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Koin |
"gateway": "koin" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| KPay Group |
"gateway": "kpaygroup" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Lapsa Payments |
"gateway": "lapsapayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| LHV Pank |
"gateway": "lhvpank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Liberty |
"gateway": "liberty" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Life Pay |
"gateway": "lifepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Limepay |
"gateway": "limepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Linkly |
"gateway": "linkly" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| LiqPay |
"gateway": "liqpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| LITIQON OÜ |
"gateway": "nuvex" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Littlepay |
"gateway": "littlepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| LogPay |
"gateway": "logpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Loyale |
"gateway": "loyale" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| lynck |
"gateway": "lynck" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Lyre |
"gateway": "lyra" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Magnetiq Bank |
"gateway": "magnetiq" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| maib |
"gateway": "maibecomm" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MakeCommerce (Maksekeskus) |
"gateway": "maksekeskus" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Maksu GMBH |
"gateway": "maksupayeu" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Mandarin |
"gateway": "mandarin" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Market Pay |
"gateway": "marketpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Mastercard Payment Gateway Services |
"gateway": "mpgs" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MerchantE |
"gateway": "merchante" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Midtrans |
"gateway": "midtrans" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Merchant Warrior |
"gateway": "merchantwarrior" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Minsait Payments Systems |
"gateway": "minsaitpaymentsgateway" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MITEC |
"gateway": "mitecmx" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MIXPLAT |
"gateway": "mixplat" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MOBI.Money |
"gateway": "mobimoney" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Modulbank |
"gateway": "modulbank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Mollie |
"gateway": "mollie" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Mondido |
"gateway": "mondido" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Monei |
"gateway": "monei" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| monek |
"gateway": "monek" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Moneris |
"gateway": "moneris" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Moneta |
"gateway": "moneta" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| Monext |
"gateway": "monext" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MoneyHash |
"gateway": "moneyhash" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Money.Mail.Ru |
"gateway": "moneymailru" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| monripayments |
"gateway": "monripayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Moov |
"gateway": "moov" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MPay |
"gateway": "managepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| mstartipg |
"gateway": "mstartipg" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Multicarta |
"gateway": "mulitcarta" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MultiSafepay |
"gateway": "multisafepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Mundipagg |
"gateway": "mundipagg" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MyCheck |
"gateway": "mycheck" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MyChoice2Pay |
"gateway": "mychoice2pay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MyFatoorah |
"gateway": "myfatoorah"
"gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| MyPay |
"gateway": "mypay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| myPOS |
"gateway": "mypos" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| N&TS Group |
"gateway": "netsgroup" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| NCCC |
"gateway": "nccc" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Neolink |
"gateway": "neolinkprocessing" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Neon Pay |
"gateway": "neonpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Netopia |
"gateway": "netopia" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Netvalve |
"gateway": "netvalve" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Network International |
"gateway": "networkintl" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Newebpay (anciennement STPath, Pay2Go) |
"gateway": "newebpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Newtech |
"gateway": "newtechmobile" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Nexi |
"gateway": "nexi" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Nexi Easy |
"gateway": "easy" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| NMI |
"gateway": "gatewayservices" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| noon payments |
"gateway": "noonpayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Noqoody Pay |
"gateway": "noqoodypay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Novalnet |
"gateway": "novalnet" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Nexi Relay |
"gateway": "nexirelay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| NTT DATA |
"gateway": "nttdatahk" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Nuvei |
"gateway": "nuvei" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Oceanpayment |
"gateway": "oceanpayment" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Omise |
"gateway": "omise" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Omno |
"gateway": "omno" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| One Inc |
"gateway": "oneinc" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Onelya |
"gateway": "onelya" "gatewayMerchantId": "YOUR_GATWAY_MERCHANT_ID" |
| Onerway |
"gateway": "ronghan" "gatewayMerchantId": "YOUR_GATWAY_MERCHANT_ID" |
| OneVision Limited |
"gateway": "onevision" "gatewayMerchantId": "YOUR_GATWAY_MERCHANT_ID" |
| OnPay |
"gateway": "onpayio" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Opayo by Elavon |
"gateway": "opayoelavon" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| OrkestaPay |
"gateway": "orkestapay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Oschadbank |
"gateway": "oschadbank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| pagarme |
"gateway": "pagarme" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PagBank |
"gateway": "pagbank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PagBrasil |
"gateway": "pagbrasil" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PagSeguro |
"gateway": "pagsegurointernational" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PAY2M |
"gateway": "pay2m" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payarc |
"gateway": "payarc" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Pay.com |
"gateway": "paycom" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PAYCOMET |
"gateway": "paycomet" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paycross Ltd |
"gateway": "paycross" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paydock |
"gateway": "paydock" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayEase |
"gateway": "payeasenet" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayEngine |
"gateway": "payengine" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayerMax |
"gateway": "payermax" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayFabric |
"gateway": "payfabric" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayFacto |
"gateway": "payfacto" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayFast |
"gateway": "gopayfastuat" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| paygent |
"gateway": "paygent" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payhub |
"gateway": "payhub" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayKKa |
"gateway": "paykkaeu" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayLane |
"gateway": "paylane" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payler |
"gateway": "payler" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayLink® |
"gateway": "paylink" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Charge utile |
"gateway": "payload" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paymark |
"gateway": "paymark" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayMaster |
"gateway": "paymaster" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payment Fusion |
"gateway": "paymentfusion" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paymentvision |
"gateway": "paymentvision" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paymentwall |
"gateway": "paymentwall" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paymo |
"gateway": "paymo" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paymob |
"gateway": "gpaymob" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayMongo |
"gateway": "paymongo" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paymtech |
"gateway": "paymtech" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayNearMe |
"gateway": "paynearme" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payneteasy |
"gateway": "payneteasy" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Pay.nl |
"gateway": "paynl" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paynopain |
"gateway": "paynopain" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayOne |
"gateway": "payone" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayOnline |
"gateway": "payonline" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payoo |
"gateway": "payoo" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Pay Theory |
"gateway": "paytheory" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayPlus |
"gateway": "payplus" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayPro Pvt Ltd |
"gateway": "paypro" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| Payrails |
"gateway": "payrails" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payrexx |
"gateway": "payrexx" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayRiff |
"gateway": "payriff" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payrix |
"gateway": "payrix" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paysafe |
"gateway": "paysafe" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payscout |
"gateway": "payscout" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paysend Business |
"gateway": "paysend" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paysoft |
"gateway": "paysoft" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Pay360 |
"gateway": "pay360" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| paytech |
"gateway": "paytechsolutions" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayTech Ukraine |
"gateway": "paytech" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Passerelle de paiement Payten |
"gateway": "paytentr" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paythru |
"gateway": "paythru" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payture |
"gateway": "payture" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayU |
"gateway": "payu" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayU LATAM |
"gateway": "payulatam" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PAYUNi |
"gateway": "payuni" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayU Romania |
"gateway": "payuro" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PayU Russia |
"gateway": "payuru" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payway |
"gateway": "payway" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paywiser |
"gateway": "paywiser" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Payzone Ireland |
"gateway": "payzoneireland" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PBT Gateway Services Ltd |
"gateway": "pbtgateway" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Pelecard |
"gateway": "pelecard" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Pensopay |
"gateway": "pensopay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Pikassa |
"gateway": "pikassa" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PingPong |
"gateway": "pingpongx" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Pin Payments |
"gateway": "pinpayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Planet |
"gateway": "cccpayment" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PlanetPay |
"gateway": "itcardpaymentservice" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Plategka.com |
"gateway": "plategkacom" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Platon |
"gateway": "platon" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Pomelo |
"gateway": "pomelopay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Portmone |
"gateway": "portmonecom" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Preczn |
"gateway": "preczn" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PrimePay |
"gateway": "primepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Primer |
"gateway": "primer" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Procard |
"gateway": "procard" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ProcessOut |
"gateway": "processout" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Przelewy24 |
"gateway": "przelewy24" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PSCB |
"gateway": "pscbru" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PSiGate Inc. |
"gateway": "psigate" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| PXP Financial |
"gateway": "pxpfinancial" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Qenta Payment CEE |
"gateway": "qenta" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| QIWI |
"gateway": "qiwi" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Qualpay |
"gateway": "qualpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| QuickPay |
"gateway": "quickpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Qvalent |
"gateway": "qvalent" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Radial |
"gateway": "radial" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Raiffeisen Processing Centre |
"gateway": "raiffeisenprocessingcentre" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Rapyd |
"gateway": "rapyd" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| RBK.money |
"gateway": "rbkmoney" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Rebail Capital |
"gateway": "rebailcapital" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Rebilly |
"gateway": "Rebilly" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Recurly |
"gateway": "recurly" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Reddot |
"gateway": "reddotpayment" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Rede |
"gateway": "rede" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Redsys |
"gateway": "redsys" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Reepay |
"gateway": "reepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| RocketGate |
"gateway": "rocketgate" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Rootline |
"gateway": "rootline" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Russian Standard Bank |
"gateway": "rsb" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Ryft |
"gateway": "ryft" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Safepay |
"gateway": "safepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Saferpay |
"gateway": "worldlinesaferpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Safexpay |
"gateway": "safexpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Sberbank |
"gateway": "sberbank" "gatewayMerchantId": "YOUR_ORGANIZATION_NAME" |
| SEB Baltic |
"gateway": "sebbaltic" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| SEBES Technology |
"gateway": "sebes" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| SecurePay |
"gateway": "securepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Sense Bank |
"gateway": "sensebank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| SensePass |
"gateway": "sensepass" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Servicios Digitales Popular S.A. |
"gateway": "pagosazul" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Shift4 |
"gateway": "shift4payments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Shiji Group |
"gateway": "shijipaymentsolutions" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| SH Start High |
"gateway": "shstartpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| shvarenapay |
"gateway": "shvarenapay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| simbasoft |
"gateway": "simbasoft" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Sipay |
"gateway": "sipay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| SmartPay |
"gateway": "smartpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Service de paiement Softbank |
"gateway": "sbps" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Softtouch POS et paiements |
"gateway": "softtouch" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Ligne continue |
"gateway": "solid" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Services de paiement Sony |
"gateway": "sonypaymentservices" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Splitit |
"gateway": "splitit" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Spreedly |
"gateway": "spreedly" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Carré |
"gateway": "square" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| SredaPay |
"gateway": "sredapay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| SSLCOMMERZ |
"gateway": "sslcommerz" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Stancer |
"gateway": "stancer" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Stripe |
"gateway": "stripe" "stripe:version": "2018-10-31" "stripe:publishableKey": "YOUR_PUBLIC_STRIPE_KEY" |
| SUMIT |
"gateway": "sumit" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Suntech |
"gateway": "esafe" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Paiements Surfboard |
"gateway": "surfboard" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Svea Bank |
"gateway": "svea" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Swedbank Baltic |
"gateway": "swedbankbaltic" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Swedbank Pay |
"gateway": "payexswedbankpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| TabaPay |
"gateway": "tabapay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| TapPay (Cherri Tech) |
"gateway": "tappay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| TapPayments |
"gateway": "tappayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| tarlanpayments |
"gateway": "tarlanpayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Lien TAS |
"gateway": "taslink" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Tatra banka (CardPay) |
"gateway": "tatrabanka" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| TEKO |
"gateway": "teko" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| theMAP |
"gateway": "themap" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Till Payments |
"gateway": "tillpayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Time Project LLC |
"gateway": "timeproject" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Tinkoff |
"gateway": "tinkoff" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| TIPTOP PAY |
"gateway": "tiptoppay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| TPay |
"gateway": "tpaycom" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| TPay.com |
"gateway": "tpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Transact Campus |
"gateway": "transactcampus" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Transact Pro |
"gateway": "transactpro" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Réseau de services de transactions |
"gateway": "tns" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Transpayrent |
"gateway": "transpayrent" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Tranzila |
"gateway": "tranzila" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Tranzzo |
"gateway": "tranzzo" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Tribe Payments |
"gateway": "tribepayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Truevo |
"gateway": "truevo" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| TrustPay |
"gateway": "trustpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Trust Payments |
"gateway": "trustpayments" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Thon |
"gateway": "tuna" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| 2can&ibox |
"gateway": "twocan" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| UAPAY |
"gateway": "uapay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| UBRR |
"gateway": "ubrrpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Ukrcardpay |
"gateway": "ukrcardpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| UkrGasBank Pay |
"gateway": "ukrgasbankpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Unibank OJSC |
"gateway": "unibankcheckout" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| unitedfinancialcorporation |
"gateway": "unitedfinancialcorporation" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Uniteller |
"gateway": "uniteller" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Unitpay |
"gateway": "unitpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Unlimint |
"gateway": "unlimint" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Unzer |
"gateway": "unzer" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Unzer Austria |
"gateway": "unzeraustria" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| UPC |
"gateway": "upc" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Upgate |
"gateway": "upgate" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| USAePay |
"gateway": "usaepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| UseePay |
"gateway": "useepay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| USIO, Inc. |
"gateway": "usio" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Valitor |
"gateway": "valitor" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| value.io |
"gateway": "inspirecommerce" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Vanco |
"gateway": "vanco" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Vantiv |
"gateway": "vantiv" "vantiv:merchantPayPageId": "YOUR_PAY_PAGE_ID" "vantiv:merchantOrderId": "YOUR_ORDER_ID" "vantiv:merchantTransactionId": "YOUR_TRANSACTION_ID" "vantiv:merchantReportGroup": "*web" |
| Vayapay |
"gateway": "vayapay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| Vendo |
"gateway": "vendoservices" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Verestro |
"gateway": "verestro" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Très bonne sécurité |
"gateway": "verygoodsecurity" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Victoriabank |
"gateway": "victoriabank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Vindicia |
"gateway": "vindicia" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Viva Wallet |
"gateway": "vivawallet" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| VTEX |
"gateway": "vtex" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Waffo |
"gateway": "waffo" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Wallee |
"gateway": "wallee" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Walletdoc |
"gateway": "walletdoc" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Walletto |
"gateway": "walletto" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| WayForPay |
"gateway": "wayforpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| WEAT |
"gateway": "weatpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| WhenThen |
"gateway": "whenthen" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Windcave |
"gateway": "windcave" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Wirebank |
"gateway": "wirebank" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Wirecard |
"gateway": "wirecard" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| WOOPPAY |
"gateway": "wooppay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| WooshPay |
"gateway": "swooshtransfer" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Worldline (GlobalCollect) |
"gateway": "globalcollect" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Worldline – Ingenico (WL Online Checkout) |
"gateway": "worldlineingenicoogone" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Worldline Nordics (Worldline Online Checkout) |
"gateway": "worldlineonlinecheckout" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Worldline Sips |
"gateway": "wlsips" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Worldnet |
"gateway": "worldnet" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Worldpay |
"gateway": "worldpay" "gatewayMerchantId": "YOUR_WORLDPAY_MERCHANT_ID" |
| Wpay |
"gateway": "wpayaus" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| WSPay |
"gateway": "wspay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| xMoney |
"gateway": "xmoneypay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| XPATE |
"gateway": "xpate" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| xpay |
"gateway": "xpaycomua" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| XPay by PostEx |
"gateway": "xpaybypostex" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| YabandPay B.V. |
"gateway": "yabandpay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Système de paiement YIĞIM |
"gateway": "yigim" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" Aucune documentation pour les développeurs disponible |
| ЮKassa (YooKassa) |
"gateway": "yoomoney" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Yuno |
"gateway": "yuno" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Z-credit |
"gateway": "zcredit" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Zalopay |
"gateway": "zalopay" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| ZEN.com |
"gateway": "zen" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Zest |
"gateway": "zestpayment" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
| Zuora |
"gateway": "zuora" "gatewayMerchantId": "YOUR_GATEWAY_MERCHANT_ID" |
example est un nom de passerelle valide dans l'environnement de test. Si vous souhaitez tester l'API, vous pouvez laisser l'exemple de code ci-dessus tel quel. Lorsque vous utilisez la passerelle example, votre site ne reçoit pas de données de carte permettant d'effectuer une transaction, mais le parcours utilisateur reste le même.
Le type de tokenisation PAYMENT_GATEWAY est l'implémentation la plus courante du mode de paiement par carte dans l'API Google Pay. Si votre fournisseur de services de paiement n'est pas compatible, vous pourrez peut-être accepter Google Pay via une intégration DIRECTE. Pour en savoir plus, consultez la documentation sur la tokenisation directe.
Étape 3 : Définissez les réseaux de cartes de paiement acceptés
Définissez les réseaux de cartes acceptés par votre site. Consultez l'exemple de code suivant :
const allowedCardNetworks = ["AMEX", "DISCOVER", "INTERAC", "JCB", "MASTERCARD", "VISA"];
L'API Google Pay peut renvoyer des cartes enregistrées sur Google.com (PAN_ONLY) ou un jeton d'appareil sur un appareil Android authentifié avec un cryptogramme 3-D Secure (CRYPTOGRAM_3DS). Vous pouvez choisir si les deux méthodes ou une seule d'entre elles peuvent être renvoyées.
Avant de définir allowedCardAuthMethods, vérifiez auprès de votre société de traitement des paiements et de votre acquéreur si les jetons d'appareil (CRYPTOGRAM_3DS) sont acceptés dans votre région.
Consultez l'exemple de code suivant :
const allowedCardAuthMethods = ["PAN_ONLY", "CRYPTOGRAM_3DS"];
Pour en savoir plus, consultez CardParameters dans notre documentation de référence sur les objets. Vérifiez également auprès de votre passerelle ou de votre processeur les réseaux de cartes acceptés et la compatibilité avec les jetons d'appareils Android.
- Assurez-vous également d'appliquer vos contrôles et vérifications des risques existants pour les transactions de paiement aux transactions Google Pay. Les contrôles de validation et de fraude Google Pay ne sont pas destinés à remplacer vos processus de gestion des risques.
- Si vous acceptez
PAN_ONLY, assurez-vous de déclencher 3D Secure (authentification renforcée) pour les transactions Google Pay PANPAN_ONLYde la même manière que pour les transactions par carte normales.
Étape 4 : Décrivez vos modes de paiement autorisés
Pour décrire les modes de paiement autorisés, procédez comme suit :
- Combinez vos méthodes d'authentification et réseaux de cartes compatibles pour décrire la compatibilité de votre site avec le mode de paiement
CARD. Consultez l'exemple de code suivant :const baseCardPaymentMethod = { type: 'CARD', parameters: { allowedAuthMethods: allowedCardAuthMethods, allowedCardNetworks: allowedCardNetworks } };
- Étendez l'objet de mode de paiement de base par carte pour décrire les informations que vous souhaitez voir renvoyées à votre application. Incluez une description des données de paiement tokenisées. Consultez l'exemple de code suivant :
const cardPaymentMethod = Object.assign( {tokenizationSpecification: tokenizationSpecification}, baseCardPaymentMethod );
Pour en savoir plus sur les parameters compatibles, consultez CardParameters.
Google Pay n'accepte actuellement que le type de mode de paiement CARD.
Étape 5 : Chargez la bibliothèque JavaScript de l'API Google Pay
Pour charger la bibliothèque JavaScript de l'API Google Pay, procédez comme suit :
- Incluez le code JavaScript hébergé par Google sur votre page. Consultez l'exemple de code suivant :
<script async src="https://pay.google.com/gp/p/js/pay.js" onload="console.log('TODO: add onload function')"> </script> - Une fois la bibliothèque JavaScript de l'API Google Pay chargée, initialisez un objet
PaymentsClient. Le développement initial utilise un environnementTEST, qui renvoie des modes de paiement fictifs permettant de référencer la structure d'une réponse de paiement. Dans cet environnement, un mode de paiement sélectionné ne permet pas d'effectuer une transaction. Consultez l'exemple de code suivant.Remarque : Nous vous recommandons de n'initialiserpaymentsClientqu'une seule fois. Utilisez la même instance lorsque vous appelez toutes les autres API, commeCreateButton,IsReadyToPay,PrefetchPaymentDataetLoadPaymentData.const paymentsClient = new google.payments.api.PaymentsClient({environment: 'TEST'});
Pour en savoir plus sur les exigences concernant un environnement
PRODUCTIONqui renvoie des modes de paiement payants, consultez la checklist d'intégration.
Étape 6 : Déterminer l'aptitude à payer avec l'API Google Pay
Pour déterminer si l'utilisateur est prêt à payer avec l'API Google Pay, procédez comme suit :
- Ajoutez vos modes de paiement autorisés à l'objet de requête de base. Consultez l'exemple de code suivant :
const isReadyToPayRequest = Object.assign({}, baseRequest); isReadyToPayRequest.allowedPaymentMethods = [baseCardPaymentMethod];
- Appelez
isReadyToPay()pour déterminer si l'API Google Pay est compatible avec l'appareil et le navigateur actuels pour les modes de paiement que vous avez spécifiés. Consultez l'exemple de code suivant :paymentsClient.isReadyToPay(isReadyToPayRequest) .then(function(response) { if (response.result) { // add a Google Pay payment button } }) .catch(function(err) { // show error in developer console for debugging console.error(err); });
Étape 7 : Ajouter un bouton de paiement Google Pay
Ajoutez un bouton de paiement Google Pay à votre page pour encourager les acheteurs à régler leurs achats avec des modes de paiement compatibles avec l'API Google Pay et votre site. Pour en savoir plus sur les types de boutons, les couleurs et les exigences d'affichage disponibles, consultez les Consignes relatives à la marque.
Consultez l'exemple de code de bouton de paiement suivant :
const button = paymentsClient.createButton({onClick: () => console.log('TODO: click handler'), allowedPaymentMethods: []}); // same payment methods as for the loadPaymentData() API call document.getElementById('container').appendChild(button);
Étape 8 : Créez un objet PaymentDataRequest
Pour créer un objet PaymentDataRequest, procédez comme suit :
- Créez un objet JavaScript qui décrit la compatibilité de votre site avec l'API Google Pay. Pour obtenir la liste complète des propriétés acceptées, consultez
PaymentDataRequest. Consultez l'exemple de code suivant :const paymentDataRequest = Object.assign({}, baseRequest);
- Ajoutez les modes de paiement acceptés par votre application, comme toute configuration de données supplémentaires attendues dans la réponse. Consultez l'exemple de code suivant :
paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod];
- Définissez un prix total et une devise qu'un client doit autoriser. Consultez l'exemple de code suivant :
Important : Les marchands qui traitent des transactions dans l'Espace économique européen (EEE) ou dans tout autre pays soumis à l'authentification forte du client (SCA) doivent inclure les paramètres
countryCode,totalPriceetmerchantNamepour répondre aux exigences de la SCA.paymentDataRequest.transactionInfo = { totalPriceStatus: 'FINAL', totalPrice: '123.45', currencyCode: 'USD', countryCode: 'US' };
- Indiquez un nom de marchand visible par l'utilisateur et utilisez la valeur
TESTmerchantIdlorsque vous êtes enTEST. Pour en savoir plus et savoir quand remplacer la valeurmerchantIdmerchantId, consultezMerchantInfo.TESTConsultez l'exemple de code suivant pour voir un nom de marchand visible par l'utilisateur :paymentDataRequest.merchantInfo = { merchantName: 'Example Merchant' merchantId: '12345678901234567890' };
Remarque : La valeurmerchantIdde notreTESTest numérique. La valeurmerchantIdspécifique peut être numérique ou alphanumérique. Consultez MerchantInfo pour en savoir plus sur la façon d'obtenir votremerchantIdspécifique.
Étape 9 : Enregistrez un gestionnaire d'événements pour les gestes de l'utilisateur
Pour enregistrer un gestionnaire d'événements pour les gestes de l'utilisateur, procédez comme suit :
- Enregistrez un gestionnaire d'événements de clic pour le bouton d'achat. Le gestionnaire d'événements appelle
loadPaymentData()immédiatement après avoir interagi avec le bouton de paiement Google Pay. - Une fois qu'un utilisateur Google a autorisé votre site à recevoir des informations sur le mode de paiement sélectionné et les coordonnées facultatives, gérez la réponse de l'API Google Pay.
- Extrayez le jeton de paiement de la réponse
paymentData. Si vous implémentez une intégration de passerelle, transmettez ce jeton à votre passerelle sans aucune modification.Remarque : Dans un environnementTEST, une réponse de paiement inclut des données récapitulatives sur le mode de paiement sélectionné, qui peuvent être affichées sur une page de confirmation. La réponse de paiement n'inclut pas de mode de paiement permettant d'effectuer une transaction.paymentsClient.loadPaymentData(paymentDataRequest).then(function(paymentData){ // if using gateway tokenization, pass this token without modification paymentToken = paymentData.paymentMethodData.tokenizationData.token; }).catch(function(err){ // show error in developer console for debugging console.error(err); });
Étape 10 (facultative) : Configurez Authorize Payments
Authorize Payments permet de lancer le processus de paiement et d'accuser réception de l'état d'autorisation d'un paiement. Pour configurer Authorize Payments, procédez comme suit :
- Enregistrez un rappel
onPaymentAuthorized()dansPaymentOptions. - Appelez la fonction
loadPaymentData()avec l'intention de rappelPAYMENT_AUTHORIZATION. - Implémentez
onPaymentAuthorized().
Enregistrer les rappels onPaymentAuthorized
L'exemple de code suivant montre comment enregistrer les rappels onPaymentAuthorized :
{ environment: "TEST", merchantInfo: { merchantName: "Example Merchant", merchantId: "12345678901234567890" }, paymentDataCallbacks: { onPaymentAuthorized: onPaymentAuthorized } }
Charger des données de paiement avec des intents de rappel
L'exemple de code suivant montre comment initialiser la feuille de paiement avec Authorize Payments :
const paymentDataRequest = Object.assign({}, baseRequest); paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod]; paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); paymentDataRequest.merchantInfo = { merchantName: 'Example Merchant' merchantId: '12345678901234567890', }; paymentDataRequest.callbackIntents = ["PAYMENT_AUTHORIZATION"];
Gérer les rappels onPaymentAuthorized
Le rappel onPaymentAuthorized() est appelé avec un objet PaymentData par Google après qu'un payeur a approuvé le paiement par un geste de l'utilisateur, par exemple en cliquant sur Payer.
Le rappel renvoie une valeur Promise<PaymentAuthorizationResult>. L'objet PaymentAuthorizationResult a un état de transaction SUCCESS ou ERROR. En cas de réussite, la feuille de paiement est fermée. Si vous rencontrez une erreur, la feuille de paiement affiche les détails de l'erreur renvoyés après le traitement du paiement. L'utilisateur peut modifier les données de paiement de la feuille de paiement et autoriser à nouveau le paiement. Consultez l'exemple de code suivant :
function onPaymentAuthorized(paymentData) { return new Promise(function(resolve, reject){ // handle the response processPayment(paymentData) .then(function() { resolve({transactionState: 'SUCCESS'}); }) .catch(function() { resolve({ transactionState: 'ERROR', error: { intent: 'PAYMENT_AUTHORIZATION', message: 'Insufficient funds', reason: 'PAYMENT_DATA_INVALID' } }); }); }); }
Étape 11 (facultative pour les produits pouvant être expédiés) : Configurer les mises à jour dynamiques des prix
Les mises à jour dynamiques des prix permettent à un marchand de mettre à jour de manière dynamique les options de livraison et les informations sur les transactions en fonction d'une adresse de livraison choisie. Vous pouvez également mettre à jour de manière dynamique les informations sur la transaction en fonction de l'option de livraison choisie.
Pour configurer les mises à jour dynamiques des prix, procédez comme suit :
- Enregistrez les rappels
onPaymentAuthorizedetonPaymentDataChangeddansPaymentOptions. - Appelez la fonction
loadPaymentData()avec des intents de rappel. Pour en savoir plus, consultez l'exemple correspondant. - Implémentez
onPaymentAuthorizedetonPaymentDataChanged.
Enregistrer le rappel PaymentData
L'exemple de code suivant montre que les mises à jour dynamiques des prix nécessitent l'enregistrement de fonctions de rappel dans l'objet PaymentsClient
paymentOptions.
{ environment: "TEST", merchantInfo: { merchantName: "Example Merchant", merchantId: "12345678901234567890" }, paymentDataCallbacks: { onPaymentAuthorized: onPaymentAuthorized, onPaymentDataChanged: onPaymentDataChanged } }
Charger des données de paiement avec des intents de rappel
L'exemple de code suivant montre comment une feuille de paiement doit être initialisée avec une configuration d'adresse de livraison et d'options de livraison requise :
const paymentDataRequest = Object.assign({}, baseRequest); paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod]; paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); paymentDataRequest.merchantInfo = { merchantId: '12345678901234567890', merchantName: 'Example Merchant' }; paymentDataRequest.callbackIntents = ["SHIPPING_ADDRESS", "SHIPPING_OPTION", "PAYMENT_AUTHORIZATION"]; paymentDataRequest.shippingAddressRequired = true; paymentDataRequest.shippingAddressParameters = getGoogleShippingAddressParameters(); paymentDataRequest.shippingOptionRequired = true;
Gérer le rappel onPaymentDataChanged
Le rappel onPaymentDataChanged est appelé avec un objet IntermediatePaymentData, qui inclut l'adresse de livraison et l'option de livraison sélectionnées dans la feuille de paiement.
Le rappel renvoie un Promise<PaymentDataRequestUpdate>. L'objet PaymentDataRequestUpdate contient de nouvelles informations sur la transaction, des options de livraison et une erreur de données de paiement. Ces données mettent à jour la feuille de paiement.
Gérez les cas exceptionnels, comme une adresse de livraison non desservie ou une option de livraison non valide, directement dans la feuille de paiement. Configurez un objet PaymentDataError pour mettre en évidence la raison de l'erreur avec un message d'erreur à l'utilisateur. Veillez à inclure l'intention associée dans le message. Pour savoir comment configurer l'objet et le message, consultez l'exemple de code suivant :
function onPaymentDataChanged(intermediatePaymentData) { return new Promise(function(resolve, reject) { let shippingAddress = intermediatePaymentData.shippingAddress; let shippingOptionData = intermediatePaymentData.shippingOptionData; let paymentDataRequestUpdate = {}; if (intermediatePaymentData.callbackTrigger == "INITIALIZE" || intermediatePaymentData.callbackTrigger == "SHIPPING_ADDRESS") { if(shippingAddress.administrativeArea == "NJ") { paymentDataRequestUpdate.error = getGoogleUnserviceableAddressError(); } else { paymentDataRequestUpdate.newShippingOptionParameters = getGoogleDefaultShippingOptions(); let selectedShippingOptionId = paymentDataRequestUpdate.newShippingOptionParameters.defaultSelectedOptionId; paymentDataRequestUpdate.newTransactionInfo = calculateNewTransactionInfo(selectedShippingOptionId); } } else if (intermediatePaymentData.callbackTrigger == "SHIPPING_OPTION") { paymentDataRequestUpdate.newTransactionInfo = calculateNewTransactionInfo(shippingOptionData.id); } resolve(paymentDataRequestUpdate); }); }
Étape 12 (facultative pour les codes promotionnels) : Configurez les codes promotionnels
Les codes promotionnels permettent à un marchand de mettre à jour de manière dynamique les options de livraison et les informations sur les transactions en fonction d'un code promotionnel fourni.
Pour configurer des codes promotionnels, procédez comme suit :
- Enregistrez les rappels
onPaymentDataChangeddansPaymentOptions. - Appelez la fonction
loadPaymentData()avec des intents de rappel. Pour en savoir plus, consultez l'exemple correspondant. - Implémentez
onPaymentDataChanged callback function.
Enregistrer le rappel d'offre
L'exemple de code suivant montre que les codes promotionnels nécessitent l'enregistrement de fonctions de rappel dans l'objet PaymentsClient
paymentOptions.
{ environment: "TEST", merchantInfo: { merchantName: "Example Merchant", merchantId: "12345678901234567890" }, paymentDataCallbacks: { onPaymentDataChanged: onPaymentDataChanged } }
Charger des données de paiement avec des intents de rappel
L'exemple de code suivant montre comment une feuille de paiement doit être initialisée avec une intention de rappel OFFER :
const paymentDataRequest = Object.assign({}, baseRequest); paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod]; paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); paymentDataRequest.merchantInfo = { merchantId: '12345678901234567890', merchantName: 'Example Merchant' }; paymentDataRequest.callbackIntents = ["OFFER"];
Gérer le rappel onPaymentDataChanged
Le rappel onPaymentDataChanged est appelé avec un objet IntermediatePaymentData, qui inclut l'adresse de livraison et l'option de livraison sélectionnées dans la feuille de paiement.
Le rappel doit renvoyer un Promise<PaymentDataRequestUpdate>. L'objet PaymentDataRequestUpdate contient de nouvelles informations sur la transaction, les options de livraison, les données de l'offre et une erreur de données de paiement. Ces données mettent à jour la feuille de paiement.
Gérez tous les cas d'exception, comme un code promotionnel non valide, directement dans la feuille de paiement. Configurez un objet PaymentDataError pour mettre en évidence la raison de l'erreur avec un message d'erreur à l'utilisateur. Veillez à inclure l'intention associée dans le message. Pour savoir comment configurer l'objet et le message, consultez l'exemple de code suivant, qui fait référence à un objet (validPromoCodes) contenant les valeurs des codes promotionnels :
function onPaymentDataChanged(intermediatePaymentData) { return new Promise(function(resolve, reject) { let redemptionCodes = []; let shippingOptionData = intermediatePaymentData.shippingOptionData; let paymentDataRequestUpdate = {}; paymentDataRequestUpdate.newTransactionInfo = getGoogleTransactionInfo(); // ensure that promo codes set is unique if(typeof intermediatePaymentData.offerData != 'undefined') { // convert to set then back to array redemptionCodes = Array.from( new Set(intermediatePaymentData.offerData.redemptionCodes) ); } // OPTIONAL: ensure that the newest promo code is the only one applied // redemptionCodes = new Array(redemptionCodes[redemptionCodes.length -1]); // validate promo codes and add descriptions to payment sheet if (intermediatePaymentData.callbackTrigger === 'OFFER') { paymentDataRequestUpdate.newOfferInfo = {}; paymentDataRequestUpdate.newOfferInfo.offers = []; for (redemptionCode of redemptionCodes) { if (validPromoCodes[redemptionCode]) { paymentDataRequestUpdate = validPromoCodes[redemptionCode].function( validPromoCodes[redemptionCode], paymentDataRequestUpdate ); } else { paymentDataRequestUpdate.error = getGoogleOfferInvalidError(redemptionCode); } } }
Regrouper tous les éléments
Les blocs de code d'exemple de cette section présentent un exemple complet de bout en bout du tutoriel sur la bibliothèque JavaScript de l'API Google Pay, l'autorisation des paiements, les mises à jour dynamiques des prix et les codes promotionnels.
Tutoriel
<div id="container"></div><script>/** * Define the version of the Google Pay API referenced when creating your * configuration * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#PaymentDataRequest|apiVersion in PaymentDataRequest} */ const baseRequest = { apiVersion: 2, apiVersionMinor: 0 }; /** * Card networks supported by your site and your gateway * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} * @todo confirm card networks supported by your site and gateway */ const allowedCardNetworks = ["AMEX", "DISCOVER", "INTERAC", "JCB", "MASTERCARD", "VISA"]; /** * Card authentication methods supported by your site and your gateway * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} * @todo confirm your processor supports Android device tokens for your * supported card networks */ const allowedCardAuthMethods = ["PAN_ONLY", "CRYPTOGRAM_3DS"]; /** * Identify your gateway and your site's gateway merchant identifier * * The Google Pay API response will return an encrypted payment method capable * of being charged by a supported gateway after payer authorization * * @todo check with your gateway on the parameters to pass * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#gateway|PaymentMethodTokenizationSpecification} */ const tokenizationSpecification = { type: 'PAYMENT_GATEWAY', parameters: { 'gateway': 'example', 'gatewayMerchantId': 'exampleGatewayMerchantId' } }; /** * Describe your site's support for the CARD payment method and its required * fields * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} */ const baseCardPaymentMethod = { type: 'CARD', parameters: { allowedAuthMethods: allowedCardAuthMethods, allowedCardNetworks: allowedCardNetworks } }; /** * Describe your site's support for the CARD payment method including optional * fields * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} */ const cardPaymentMethod = Object.assign( {}, baseCardPaymentMethod, { tokenizationSpecification: tokenizationSpecification } ); /** * An initialized google.payments.api.PaymentsClient object or null if not yet set * * @see {@link getGooglePaymentsClient} */ let paymentsClient = null; /** * Configure your site's support for payment methods supported by the Google Pay * API. * * Each member of allowedPaymentMethods should contain only the required fields, * allowing reuse of this base request when determining a viewer's ability * to pay and later requesting a supported payment method * * @returns {object} Google Pay API version, payment methods supported by the site */ function getGoogleIsReadyToPayRequest() { return Object.assign( {}, baseRequest, { allowedPaymentMethods: [baseCardPaymentMethod] } ); } /** * Configure support for the Google Pay API * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#PaymentDataRequest|PaymentDataRequest} * @returns {object} PaymentDataRequest fields */ function getGooglePaymentDataRequest() { const paymentDataRequest = Object.assign({}, baseRequest); paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod]; paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); paymentDataRequest.merchantInfo = { // @todo a merchant ID is available for a production environment after approval by Google // See {@link https://developers.google.com/pay/api/web/guides/test-and-deploy/integration-checklist|Integration checklist} // merchantId: '12345678901234567890', merchantName: 'Example Merchant' }; return paymentDataRequest; } /** * Return an active PaymentsClient or initialize * * @see {@link https://developers.google.com/pay/api/web/reference/client#PaymentsClient|PaymentsClient constructor} * @returns {google.payments.api.PaymentsClient} Google Pay API client */ function getGooglePaymentsClient() { if ( paymentsClient === null ) { paymentsClient = new google.payments.api.PaymentsClient({environment: 'TEST'}); } return paymentsClient; } /** * Initialize Google PaymentsClient after Google-hosted JavaScript has loaded * * Display a Google Pay payment button after confirmation of the viewer's * ability to pay. */ function onGooglePayLoaded() { const paymentsClient = getGooglePaymentsClient(); paymentsClient.isReadyToPay(getGoogleIsReadyToPayRequest()) .then(function(response) { if (response.result) { addGooglePayButton(); // @todo prefetch payment data to improve performance after confirming site functionality // prefetchGooglePaymentData(); } }) .catch(function(err) { // show error in developer console for debugging console.error(err); }); } /** * Add a Google Pay purchase button alongside an existing checkout button * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#ButtonOptions|Button options} * @see {@link https://developers.google.com/pay/api/web/guides/brand-guidelines|Google Pay brand guidelines} */ function addGooglePayButton() { const paymentsClient = getGooglePaymentsClient(); const button = paymentsClient.createButton({ onClick: onGooglePaymentButtonClicked, allowedPaymentMethods: [baseCardPaymentMethod] }); document.getElementById('container').appendChild(button); } /** * Provide Google Pay API with a payment amount, currency, and amount status * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#TransactionInfo|TransactionInfo} * @returns {object} transaction info, suitable for use as transactionInfo property of PaymentDataRequest */ function getGoogleTransactionInfo() { return { countryCode: 'US', currencyCode: 'USD', totalPriceStatus: 'FINAL', // set to cart total totalPrice: '1.00' }; } /** * Prefetch payment data to improve performance * * @see {@link https://developers.google.com/pay/api/web/reference/client#prefetchPaymentData|prefetchPaymentData()} */ function prefetchGooglePaymentData() { const paymentDataRequest = getGooglePaymentDataRequest(); // transactionInfo must be set but does not affect cache paymentDataRequest.transactionInfo = { totalPriceStatus: 'NOT_CURRENTLY_KNOWN', currencyCode: 'USD' }; const paymentsClient = getGooglePaymentsClient(); paymentsClient.prefetchPaymentData(paymentDataRequest); } /** * Show Google Pay payment sheet when Google Pay payment button is clicked */ function onGooglePaymentButtonClicked() { const paymentDataRequest = getGooglePaymentDataRequest(); paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); const paymentsClient = getGooglePaymentsClient(); paymentsClient.loadPaymentData(paymentDataRequest) .then(function(paymentData) { // handle the response processPayment(paymentData); }) .catch(function(err) { // show error in developer console for debugging console.error(err); }); } /** * Process payment data returned by the Google Pay API * * @param {object} paymentData response from Google Pay API after user approves payment * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentData|PaymentData object reference} */ function processPayment(paymentData) { // show returned data in developer console for debugging console.log(paymentData); // @todo pass payment token to your gateway to process payment // @note DO NOT save the payment credentials for future transactions, // unless they're used for merchant-initiated transactions with user // consent in place. paymentToken = paymentData.paymentMethodData.tokenizationData.token; }</script><script async src="https://pay.google.com/gp/p/js/pay.js" onload="onGooglePayLoaded()"></script>
Autoriser les paiements
<div id="container"></div><script>/** * Define the version of the Google Pay API referenced when creating your * configuration * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#PaymentDataRequest|apiVersion in PaymentDataRequest} */ const baseRequest = { apiVersion: 2, apiVersionMinor: 0 }; /** * Card networks supported by your site and your gateway * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} * @todo confirm card networks supported by your site and gateway */ const allowedCardNetworks = ["AMEX", "DISCOVER", "INTERAC", "JCB", "MASTERCARD", "VISA"]; /** * Card authentication methods supported by your site and your gateway * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} * @todo confirm your processor supports Android device tokens for your * supported card networks */ const allowedCardAuthMethods = ["PAN_ONLY", "CRYPTOGRAM_3DS"]; /** * Identify your gateway and your site's gateway merchant identifier * * The Google Pay API response will return an encrypted payment method capable * of being charged by a supported gateway after payer authorization * * @todo check with your gateway on the parameters to pass * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#gateway|PaymentMethodTokenizationSpecification} */ const tokenizationSpecification = { type: 'PAYMENT_GATEWAY', parameters: { 'gateway': 'example', 'gatewayMerchantId': 'exampleGatewayMerchantId' } }; /** * Describe your site's support for the CARD payment method and its required * fields * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} */ const baseCardPaymentMethod = { type: 'CARD', parameters: { allowedAuthMethods: allowedCardAuthMethods, allowedCardNetworks: allowedCardNetworks } }; /** * Describe your site's support for the CARD payment method including optional * fields * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} */ const cardPaymentMethod = Object.assign( {}, baseCardPaymentMethod, { tokenizationSpecification: tokenizationSpecification } ); /** * An initialized google.payments.api.PaymentsClient object or null if not yet set * * @see {@link getGooglePaymentsClient} */ let paymentsClient = null; /** * Configure your site's support for payment methods supported by the Google Pay * API. * * Each member of allowedPaymentMethods should contain only the required fields, * allowing reuse of this base request when determining a viewer's ability * to pay and later requesting a supported payment method * * @returns {object} Google Pay API version, payment methods supported by the site */ function getGoogleIsReadyToPayRequest() { return Object.assign( {}, baseRequest, { allowedPaymentMethods: [baseCardPaymentMethod] } ); } /** * Configure support for the Google Pay API * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#PaymentDataRequest|PaymentDataRequest} * @returns {object} PaymentDataRequest fields */ function getGooglePaymentDataRequest() { const paymentDataRequest = Object.assign({}, baseRequest); paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod]; paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); paymentDataRequest.merchantInfo = { // @todo a merchant ID is available for a production environment after approval by Google // See {@link https://developers.google.com/pay/api/web/guides/test-and-deploy/integration-checklist|Integration checklist} // merchantId: '12345678901234567890', merchantName: 'Example Merchant' }; paymentDataRequest.callbackIntents = ["PAYMENT_AUTHORIZATION"]; return paymentDataRequest; } /** * Return an active PaymentsClient or initialize * * @see {@link https://developers.google.com/pay/api/web/reference/client#PaymentsClient|PaymentsClient constructor} * @returns {google.payments.api.PaymentsClient} Google Pay API client */ function getGooglePaymentsClient() { if ( paymentsClient === null ) { paymentsClient = new google.payments.api.PaymentsClient({ environment: 'TEST', paymentDataCallbacks: { onPaymentAuthorized: onPaymentAuthorized } }); } return paymentsClient; } /** * Handles authorize payments callback intents. * * @param {object} paymentData response from Google Pay API after a payer approves payment through user gesture. * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentData object reference} * * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentAuthorizationResult} * @returns Promise<{object}> Promise of PaymentAuthorizationResult object to acknowledge the payment authorization status. */ function onPaymentAuthorized(paymentData) { return new Promise(function(resolve, reject){ // handle the response processPayment(paymentData) .then(function() { resolve({transactionState: 'SUCCESS'}); }) .catch(function() { resolve({ transactionState: 'ERROR', error: { intent: 'PAYMENT_AUTHORIZATION', message: 'Insufficient funds', reason: 'PAYMENT_DATA_INVALID' } }); }); }); } /** * Initialize Google PaymentsClient after Google-hosted JavaScript has loaded * * Display a Google Pay payment button after confirmation of the viewer's * ability to pay. */ function onGooglePayLoaded() { const paymentsClient = getGooglePaymentsClient(); paymentsClient.isReadyToPay(getGoogleIsReadyToPayRequest()) .then(function(response) { if (response.result) { addGooglePayButton(); } }) .catch(function(err) { // show error in developer console for debugging console.error(err); }); } /** * Add a Google Pay purchase button alongside an existing checkout button * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#ButtonOptions|Button options} * @see {@link https://developers.google.com/pay/api/web/guides/brand-guidelines|Google Pay brand guidelines} */ function addGooglePayButton() { const paymentsClient = getGooglePaymentsClient(); const button = paymentsClient.createButton({ onClick: onGooglePaymentButtonClicked, allowedPaymentMethods: [baseCardPaymentMethod] }); document.getElementById('container').appendChild(button); } /** * Provide Google Pay API with a payment amount, currency, and amount status * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#TransactionInfo|TransactionInfo} * @returns {object} transaction info, suitable for use as transactionInfo property of PaymentDataRequest */ function getGoogleTransactionInfo() { return { displayItems: [ { label: "Subtotal", type: "SUBTOTAL", price: "11.00", }, { label: "Tax", type: "TAX", price: "1.00", } ], countryCode: 'US', currencyCode: "USD", totalPriceStatus: "FINAL", totalPrice: "12.00", totalPriceLabel: "Total" }; } /** * Show Google Pay payment sheet when Google Pay payment button is clicked */ function onGooglePaymentButtonClicked() { const paymentDataRequest = getGooglePaymentDataRequest(); paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); const paymentsClient = getGooglePaymentsClient(); paymentsClient.loadPaymentData(paymentDataRequest); } /** * Process payment data returned by the Google Pay API * * @param {object} paymentData response from Google Pay API after user approves payment * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentData|PaymentData object reference} */ function processPayment(paymentData) { return new Promise(function(resolve, reject) { setTimeout(function() { // @todo pass payment token to your gateway to process payment paymentToken = paymentData.paymentMethodData.tokenizationData.token; resolve({}); }, 3000); }); }</script><script async src="https://pay.google.com/gp/p/js/pay.js" onload="onGooglePayLoaded()"></script>
Mises à jour dynamiques des prix
<div id="container"></div><script>/** * Define the version of the Google Pay API referenced when creating your * configuration * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#PaymentDataRequest|apiVersion in PaymentDataRequest} */ const baseRequest = { apiVersion: 2, apiVersionMinor: 0 }; /** * Card networks supported by your site and your gateway * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} * @todo confirm card networks supported by your site and gateway */ const allowedCardNetworks = ["AMEX", "DISCOVER", "JCB", "MASTERCARD", "VISA"]; /** * Card authentication methods supported by your site and your gateway * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} * @todo confirm your processor supports Android device tokens for your * supported card networks */ const allowedCardAuthMethods = ["PAN_ONLY", "CRYPTOGRAM_3DS"]; /** * Identify your gateway and your site's gateway merchant identifier * * The Google Pay API response will return an encrypted payment method capable * of being charged by a supported gateway after payer authorization * * @todo check with your gateway on the parameters to pass * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#gateway|PaymentMethodTokenizationSpecification} */ const tokenizationSpecification = { type: 'PAYMENT_GATEWAY', parameters: { 'gateway': 'example', 'gatewayMerchantId': 'exampleGatewayMerchantId' } }; /** * Describe your site's support for the CARD payment method and its required * fields * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} */ const baseCardPaymentMethod = { type: 'CARD', parameters: { allowedAuthMethods: allowedCardAuthMethods, allowedCardNetworks: allowedCardNetworks } }; /** * Describe your site's support for the CARD payment method including optional * fields * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} */ const cardPaymentMethod = Object.assign( {}, baseCardPaymentMethod, { tokenizationSpecification: tokenizationSpecification } ); /** * An initialized google.payments.api.PaymentsClient object or null if not yet set * * @see {@link getGooglePaymentsClient} */ let paymentsClient = null; /** * Configure your site's support for payment methods supported by the Google Pay * API. * * Each member of allowedPaymentMethods should contain only the required fields, * allowing reuse of this base request when determining a viewer's ability * to pay and later requesting a supported payment method * * @returns {object} Google Pay API version, payment methods supported by the site */ function getGoogleIsReadyToPayRequest() { return Object.assign( {}, baseRequest, { allowedPaymentMethods: [baseCardPaymentMethod] } ); } /** * Configure support for the Google Pay API * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#PaymentDataRequest|PaymentDataRequest} * @returns {object} PaymentDataRequest fields */ function getGooglePaymentDataRequest() { const paymentDataRequest = Object.assign({}, baseRequest); paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod]; paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); paymentDataRequest.merchantInfo = { // @todo a merchant ID is available for a production environment after approval by Google // See {@link https://developers.google.com/pay/api/web/guides/test-and-deploy/integration-checklist|Integration checklist} // merchantId: '12345678901234567890', merchantName: 'Example Merchant' }; paymentDataRequest.callbackIntents = ["SHIPPING_ADDRESS", "SHIPPING_OPTION", "PAYMENT_AUTHORIZATION"]; paymentDataRequest.shippingAddressRequired = true; paymentDataRequest.shippingAddressParameters = getGoogleShippingAddressParameters(); paymentDataRequest.shippingOptionRequired = true; return paymentDataRequest; } /** * Return an active PaymentsClient or initialize * * @see {@link https://developers.google.com/pay/api/web/reference/client#PaymentsClient|PaymentsClient constructor} * @returns {google.payments.api.PaymentsClient} Google Pay API client */ function getGooglePaymentsClient() { if ( paymentsClient === null ) { paymentsClient = new google.payments.api.PaymentsClient({ environment: "TEST", merchantInfo: { merchantName: "Example Merchant", merchantId: "01234567890123456789" }, paymentDataCallbacks: { onPaymentAuthorized: onPaymentAuthorized, onPaymentDataChanged: onPaymentDataChanged } }); } return paymentsClient; } function onPaymentAuthorized(paymentData) { return new Promise(function(resolve, reject){ // handle the response processPayment(paymentData) .then(function() { resolve({transactionState: 'SUCCESS'}); }) .catch(function() { resolve({ transactionState: 'ERROR', error: { intent: 'PAYMENT_AUTHORIZATION', message: 'Insufficient funds', reason: 'PAYMENT_DATA_INVALID' } }); }); }); } /** * Handles dynamic buy flow shipping address and shipping options callback intents. * * @param {object} itermediatePaymentData response from Google Pay API a shipping address or shipping option is selected in the payment sheet. * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#IntermediatePaymentData|IntermediatePaymentData object reference} * * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentDataRequestUpdate|PaymentDataRequestUpdate} * @returns Promise<{object}> Promise of PaymentDataRequestUpdate object to update the payment sheet. */ function onPaymentDataChanged(intermediatePaymentData) { return new Promise(function(resolve, reject) { let shippingAddress = intermediatePaymentData.shippingAddress; let shippingOptionData = intermediatePaymentData.shippingOptionData; let paymentDataRequestUpdate = {}; if (intermediatePaymentData.callbackTrigger == "INITIALIZE" || intermediatePaymentData.callbackTrigger == "SHIPPING_ADDRESS") { if(shippingAddress.administrativeArea == "NJ") { paymentDataRequestUpdate.error = getGoogleUnserviceableAddressError(); } else { paymentDataRequestUpdate.newShippingOptionParameters = getGoogleDefaultShippingOptions(); let selectedShippingOptionId = paymentDataRequestUpdate.newShippingOptionParameters.defaultSelectedOptionId; paymentDataRequestUpdate.newTransactionInfo = calculateNewTransactionInfo(selectedShippingOptionId); } } else if (intermediatePaymentData.callbackTrigger == "SHIPPING_OPTION") { paymentDataRequestUpdate.newTransactionInfo = calculateNewTransactionInfo(shippingOptionData.id); } resolve(paymentDataRequestUpdate); }); } /** * Helper function to create a new TransactionInfo object. * @param string shippingOptionId respresenting the selected shipping option in the payment sheet. * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#TransactionInfo|TransactionInfo} * @returns {object} transaction info, suitable for use as transactionInfo property of PaymentDataRequest */ function calculateNewTransactionInfo(shippingOptionId) { let newTransactionInfo = getGoogleTransactionInfo(); let shippingCost = getShippingCosts()[shippingOptionId]; newTransactionInfo.displayItems.push({ type: "LINE_ITEM", label: "Shipping cost", price: shippingCost, status: "FINAL" }); let totalPrice = 0.00; newTransactionInfo.displayItems.forEach(displayItem => totalPrice += parseFloat(displayItem.price)); newTransactionInfo.totalPrice = totalPrice.toString(); return newTransactionInfo; } /** * Initialize Google PaymentsClient after Google-hosted JavaScript has loaded * * Display a Google Pay payment button after confirmation of the viewer's * ability to pay. */ function onGooglePayLoaded() { const paymentsClient = getGooglePaymentsClient(); paymentsClient.isReadyToPay(getGoogleIsReadyToPayRequest()) .then(function(response) { if (response.result) { addGooglePayButton(); // @todo prefetch payment data to improve performance after confirming site functionality // prefetchGooglePaymentData(); } }) .catch(function(err) { // show error in developer console for debugging console.error(err); }); } /** * Add a Google Pay purchase button alongside an existing checkout button * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#ButtonOptions|Button options} * @see {@link https://developers.google.com/pay/api/web/guides/brand-guidelines|Google Pay brand guidelines} */ function addGooglePayButton() { const paymentsClient = getGooglePaymentsClient(); const button = paymentsClient.createButton({ onClick: onGooglePaymentButtonClicked, allowedPaymentMethods: [baseCardPaymentMethod] }); document.getElementById('container').appendChild(button); } /** * Provide Google Pay API with a payment amount, currency, and amount status * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#TransactionInfo|TransactionInfo} * @returns {object} transaction info, suitable for use as transactionInfo property of PaymentDataRequest */ function getGoogleTransactionInfo() { return { displayItems: [ { label: "Subtotal", type: "SUBTOTAL", price: "11.00", }, { label: "Tax", type: "TAX", price: "1.00", } ], countryCode: 'US', currencyCode: "USD", totalPriceStatus: "FINAL", totalPrice: "12.00", totalPriceLabel: "Total" }; } /** * Provide a key value store for shippping options. */ function getShippingCosts() { return { "shipping-001": "0.00", "shipping-002": "1.99", "shipping-003": "10.00" } } /** * Provide Google Pay API with shipping address parameters when using dynamic buy flow. * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#ShippingAddressParameters|ShippingAddressParameters} * @returns {object} shipping address details, suitable for use as shippingAddressParameters property of PaymentDataRequest */ function getGoogleShippingAddressParameters() { return { allowedCountryCodes: ['US'], phoneNumberRequired: true }; } /** * Provide Google Pay API with shipping options and a default selected shipping option. * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#ShippingOptionParameters|ShippingOptionParameters} * @returns {object} shipping option parameters, suitable for use as shippingOptionParameters property of PaymentDataRequest */ function getGoogleDefaultShippingOptions() { return { defaultSelectedOptionId: "shipping-001", shippingOptions: [ { "id": "shipping-001", "label": "Free: Standard shipping", "description": "Free Shipping delivered in 5 business days." }, { "id": "shipping-002", "label": "$1.99: Standard shipping", "description": "Standard shipping delivered in 3 business days." }, { "id": "shipping-003", "label": "$10: Express shipping", "description": "Express shipping delivered in 1 business day." }, ] }; } /** * Provide Google Pay API with a payment data error. * * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentDataError|PaymentDataError} * @returns {object} payment data error, suitable for use as error property of PaymentDataRequestUpdate */ function getGoogleUnserviceableAddressError() { return { reason: "SHIPPING_ADDRESS_UNSERVICEABLE", message: "Cannot ship to the selected address", intent: "SHIPPING_ADDRESS" }; } /** * Prefetch payment data to improve performance * * @see {@link https://developers.google.com/pay/api/web/reference/client#prefetchPaymentData|prefetchPaymentData()} */ function prefetchGooglePaymentData() { const paymentDataRequest = getGooglePaymentDataRequest(); // transactionInfo must be set but does not affect cache paymentDataRequest.transactionInfo = { totalPriceStatus: 'NOT_CURRENTLY_KNOWN', currencyCode: 'USD' }; const paymentsClient = getGooglePaymentsClient(); paymentsClient.prefetchPaymentData(paymentDataRequest); } /** * Show Google Pay payment sheet when Google Pay payment button is clicked */ function onGooglePaymentButtonClicked() { const paymentDataRequest = getGooglePaymentDataRequest(); paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); const paymentsClient = getGooglePaymentsClient(); paymentsClient.loadPaymentData(paymentDataRequest); } /** * Process payment data returned by the Google Pay API * * @param {object} paymentData response from Google Pay API after user approves payment * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentData|PaymentData object reference} */ function processPayment(paymentData) { return new Promise(function(resolve, reject) { setTimeout(function() { // show returned data in developer console for debugging console.log(paymentData); // @todo pass payment token to your gateway to process payment paymentToken = paymentData.paymentMethodData.tokenizationData.token; resolve({}); }, 3000); }); }</script><script async src="https://pay.google.com/gp/p/js/pay.js" onload="onGooglePayLoaded()"></script>
Offres
<div id="container"></div><script>/** * Please note: The Promo Code callback is extremely flexible. This example * implementation is only one of many ways to interface with it. * * In production, your promo codes and payment logic should be securely * processed on your server, not client-side as in this example. Use AJAX to * pass this information to the payment sheet. */ /** * Define the version of the Google Pay API referenced when creating your * configuration * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#PaymentDataRequest|apiVersion in PaymentDataRequest} */ const baseRequest = { apiVersion: 2, apiVersionMinor: 0 }; /** * Define valid promo code strings * * This object paradigm is not necessary to implement Promo Codes, but provides * an example of how to implement promo code behavior in a modular way. * * In production, your promo codes should be securely processed on your server, * not client-side as in this example. * * code: the way the promo code itself is displayed in the payment sheet * description: the description provided to the user on the payment sheet * function: the function used to calculate the price change * value: the value passed into the above function. This value should be * negative for a discount. */ const validPromoCodes = { SOMEPROMOCODE: { code: 'SOMEPROMOCODE', description: '20% off all products!', function: percentageDiscount, value: -20 // value should be negative for a discount }, ANOTHERPROMOCODE: { code: 'ANOTHERPROMOCODE', description: '$5 dollars off!', function: staticDiscount, value: -5.00 // value should be negative for a discount } } /** * Card networks supported by your site and your gateway * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} * @todo confirm card networks supported by your site and gateway */ const allowedCardNetworks = ['AMEX', 'DISCOVER', 'JCB', 'MASTERCARD', 'VISA']; /** * Card authentication methods supported by your site and your gateway * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} * @todo confirm your processor supports Android device tokens for your * supported card networks */ const allowedCardAuthMethods = ['PAN_ONLY', 'CRYPTOGRAM_3DS']; /** * Identify your gateway and your site's gateway merchant identifier * * The Google Pay API response will return an encrypted payment method capable * of being charged by a supported gateway after payer authorization * * @todo check with your gateway on the parameters to pass * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#gateway|PaymentMethodTokenizationSpecification} */ const tokenizationSpecification = { type: 'PAYMENT_GATEWAY', parameters: { gateway: 'example', gatewayMerchantId: 'exampleGatewayMerchantId' } }; /** * Describe your site's support for the CARD payment method and its required * fields * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} */ const baseCardPaymentMethod = { type: 'CARD', parameters: { allowedAuthMethods: allowedCardAuthMethods, allowedCardNetworks: allowedCardNetworks } }; /** * Describe your site's support for the CARD payment method including optional * fields * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#CardParameters|CardParameters} */ const cardPaymentMethod = Object.assign( {}, baseCardPaymentMethod, { tokenizationSpecification: tokenizationSpecification } ); /** * An initialized google.payments.api.PaymentsClient object or null if not yet set * * @see {@link getGooglePaymentsClient} */ let paymentsClient = null; /** * Configure your site's support for payment methods supported by the Google Pay * API. * * Each member of allowedPaymentMethods should contain only the required fields, * allowing reuse of this base request when determining a viewer's ability * to pay and later requesting a supported payment method * * @returns {object} Google Pay API version, payment methods supported by the site */ function getGoogleIsReadyToPayRequest() { return Object.assign( {}, baseRequest, { allowedPaymentMethods: [baseCardPaymentMethod] } ); } /** * Configure support for the Google Pay API * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#PaymentDataRequest|PaymentDataRequest} * @returns {object} PaymentDataRequest fields */ function getGooglePaymentDataRequest() { const paymentDataRequest = Object.assign({}, baseRequest); paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod]; paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); paymentDataRequest.merchantInfo = { // @todo a merchant ID is available for a production environment after approval by Google // See {@link https://developers.google.com/pay/api/web/guides/test-and-deploy/integration-checklist|Integration checklist} // merchantId: '12345678901234567890', merchantName: 'Example Merchant' }; paymentDataRequest.callbackIntents = ['OFFER']; paymentDataRequest.shippingAddressRequired = false; paymentDataRequest.shippingAddressParameters = getGoogleShippingAddressParameters(); return paymentDataRequest; } /** * Return an active PaymentsClient or initialize * * @see {@link https://developers.google.com/pay/api/web/reference/client#PaymentsClient|PaymentsClient constructor} * @returns {google.payments.api.PaymentsClient} Google Pay API client */ function getGooglePaymentsClient() { if ( paymentsClient === null ) { paymentsClient = new google.payments.api.PaymentsClient({ environment: 'TEST', merchantInfo: { merchantName: 'Example Merchant', merchantId: '01234567890123456789' }, paymentDataCallbacks: { onPaymentDataChanged: onPaymentDataChanged } }); } return paymentsClient; } /** * These functions handle adding valid promo codes to the payment sheet * as well as adjusting the display items to match. * * To add a new promo code, create a new function per this template * and define it as valid in the onPaymentDataChanged function. * * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentDataRequestUpdate|PaymentDataRequestUpdate} * @param {string} redemptionCode string representing the promo code to apply * @param {string} description string representing the description to show * @param {int} discountPercentage int representing the percentage to discount. * Please note the discount value should be negative. Ex: -20 = 20% discount. * @param {object} PaymentDataRequestUpdate object representing * the current state of the payment data request. * @returns {object} PaymentDataRequestUpdate object to update the * payment sheet with new transaction info and offer data. */ function percentageDiscount(promoParameters, paymentDataRequestUpdate) { // set variables let originalTransactionInfo = getGoogleTransactionInfo(); /* because this promo code calculates a % of original prices, * we need to get the original transaction info */ let newTransactionInfo = paymentDataRequestUpdate.newTransactionInfo; let discount = 0; // update promo code and description paymentDataRequestUpdate.newOfferInfo.offers.push({ redemptionCode: promoParameters['code'], description: promoParameters['description'] }); // calculate discount (from original transaction items only) originalTransactionInfo.displayItems.forEach(function(displayItem) { discount += parseFloat(displayItem.price) * promoParameters['value'] * 0.01; }); // add displayItem with new discount newTransactionInfo.displayItems.push({ label: promoParameters['code'], price: discount.toFixed(2), type: 'LINE_ITEM' }); return paymentDataRequestUpdate; } function staticDiscount(promoParameters, paymentDataRequestUpdate) { // set variables let newTransactionInfo = paymentDataRequestUpdate.newTransactionInfo; // update promo code and description paymentDataRequestUpdate.newOfferInfo.offers.push({ redemptionCode: promoParameters['code'], description: promoParameters['description'] }); // add displayItem with new discount newTransactionInfo.displayItems.push({ label: promoParameters['code'], price: promoParameters['value'].toFixed(2), type: 'LINE_ITEM' }); return paymentDataRequestUpdate; } /** * Handles offer callback intents. * * @param {object} itermediatePaymentData response from Google Pay API when a promo code is entered in the google pay payment sheet. * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#IntermediatePaymentData|IntermediatePaymentData object reference} * * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentDataRequestUpdate|PaymentDataRequestUpdate} * @returns Promise<{object}> Promise of PaymentDataRequestUpdate object to update the payment sheet with new transaction info and offer data. */ function onPaymentDataChanged(intermediatePaymentData) { return new Promise(function(resolve, reject) { let redemptionCodes = new Set(); let shippingOptionData = intermediatePaymentData.shippingOptionData; let paymentDataRequestUpdate = {}; paymentDataRequestUpdate.newTransactionInfo = getGoogleTransactionInfo(); // ensure that promo codes set is unique if(typeof intermediatePaymentData.offerData != 'undefined') { redemptionCodes = new Set(intermediatePaymentData.offerData.redemptionCodes); } // validate promo codes and add descriptions to payment sheet if (intermediatePaymentData.callbackTrigger === 'OFFER') { paymentDataRequestUpdate.newOfferInfo = {}; paymentDataRequestUpdate.newOfferInfo.offers = []; for (redemptionCode of redemptionCodes) { if (validPromoCodes[redemptionCode]) { paymentDataRequestUpdate = validPromoCodes[redemptionCode].function( validPromoCodes[redemptionCode], paymentDataRequestUpdate ); } else { paymentDataRequestUpdate.error = getGoogleOfferInvalidError(redemptionCode); } } } /** * Update item costs and total. * * In production, this final calculation should always be calculated * server-side to ensure it matches the price that the merchant sends to the * processor. */ paymentDataRequestUpdate.newTransactionInfo = calculateNewTransactionInfo( paymentDataRequestUpdate.newTransactionInfo ) resolve(paymentDataRequestUpdate); }); } /** * Helper function to update the TransactionInfo object. * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#TransactionInfo|TransactionInfo} * @param {object} transactionInfo respresenting the selected shipping option in the payment sheet. * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#TransactionInfo|TransactionInfo} * @returns {object} transaction info, suitable for use as transactionInfo property of PaymentDataRequest */ function calculateNewTransactionInfo(newTransactionInfo) { // calculate the new totalPrice from display items let totalPrice = 0.00; newTransactionInfo.displayItems.forEach( function(displayItem) { totalPrice += parseFloat(displayItem.price); } ); // Note: newTransactionInfo.totalPrice must be a string newTransactionInfo.totalPrice = totalPrice.toFixed(2); return newTransactionInfo; } /** * Initialize Google PaymentsClient after Google-hosted JavaScript has loaded * * Display a Google Pay payment button after confirmation of the viewer's * ability to pay. */ function onGooglePayLoaded() { const paymentsClient = getGooglePaymentsClient(); paymentsClient.isReadyToPay(getGoogleIsReadyToPayRequest()) .then(function(response) { if (response.result) { addGooglePayButton(); // @todo prefetch payment data to improve performance after confirming site functionality // prefetchGooglePaymentData(); } }) .catch(function(err) { // show error in developer console for debugging console.error(err); }); } /** * Add a Google Pay purchase button alongside an existing checkout button * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#ButtonOptions|Button options} * @see {@link https://developers.google.com/pay/api/web/guides/brand-guidelines|Google Pay brand guidelines} */ function addGooglePayButton() { const paymentsClient = getGooglePaymentsClient(); const button = paymentsClient.createButton({ onClick: onGooglePaymentButtonClicked, allowedPaymentMethods: [baseCardPaymentMethod] }); document.getElementById('container').appendChild(button); } /** * Provide Google Pay API with a payment amount, currency, and amount status * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#TransactionInfo|TransactionInfo} * @returns {object} transaction info, suitable for use as transactionInfo property of PaymentDataRequest */ function getGoogleTransactionInfo() { return { displayItems: [ { label: 'Subtotal', type: 'SUBTOTAL', price: '11.00', status: 'FINAL' }, { label: 'Tax', type: 'TAX', price: '1.00' } ], currencyCode: 'USD', totalPriceStatus: 'FINAL', totalPrice: '12.00', totalPriceLabel: 'Total' }; } /** * Provide Google Pay API with shipping address parameters. * * @see {@link https://developers.google.com/pay/api/web/reference/request-objects#ShippingAddressParameters|ShippingAddressParameters} * @returns {object} shipping address details, suitable for use as shippingAddressParameters property of PaymentDataRequest */ function getGoogleShippingAddressParameters() { return { allowedCountryCodes: ['US', 'UK', 'FR', 'CA', 'MX', 'GA'], phoneNumberRequired: false }; } /** * Provide Google Pay API with an invalid offer error. * * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentDataError|PaymentDataError} * @returns {object} payment data error, suitable for use as error property of PaymentDataRequestUpdate */ function getGoogleOfferInvalidError(redemptionCode) { return { reason: 'OFFER_INVALID', message: redemptionCode + ' is not a valid promo code.', intent: 'OFFER' }; } /** * Prefetch payment data to improve performance * * @see {@link https://developers.google.com/pay/api/web/reference/client#prefetchPaymentData|prefetchPaymentData()} */ function prefetchGooglePaymentData() { const paymentDataRequest = getGooglePaymentDataRequest(); // transactionInfo must be set but does not affect cache paymentDataRequest.transactionInfo = { totalPriceStatus: 'NOT_CURRENTLY_KNOWN', currencyCode: 'USD' }; const paymentsClient = getGooglePaymentsClient(); paymentsClient.prefetchPaymentData(paymentDataRequest); } /** * Show Google Pay payment sheet when Google Pay payment button is clicked */ function onGooglePaymentButtonClicked() { const paymentDataRequest = getGooglePaymentDataRequest(); paymentDataRequest.transactionInfo = getGoogleTransactionInfo(); const paymentsClient = getGooglePaymentsClient(); paymentsClient.loadPaymentData(paymentDataRequest) .then(function(paymentData) { // handle the response processPayment(paymentData); }) .catch(function(err) { // show error in developer console for debugging console.error(err); }); } /** * Process payment data returned by the Google Pay API * In a production environment, this function should always be implemented * server-side. * * @param {object} paymentData response from Google Pay API after user approves payment * @see {@link https://developers.google.com/pay/api/web/reference/response-objects#PaymentData|PaymentData object reference} */ function processPayment(paymentData) { // show returned data in developer console for debugging console.log(paymentData); // @todo pass payment token to your gateway to process payment paymentToken = paymentData.paymentMethodData.tokenizationData.token; }</script><script async src="https://pay.google.com/gp/p/js/pay.js" onload="onGooglePayLoaded()"></script>