Tutorial

Siga as etapas deste tutorial para integrar um aplicativo da Web com a API Google Pay e configurá-lo para aceitar cartões de pagamento.

Etapa 1: definir a versão da API Google Pay
Etapa 2: escolher um método de tokenização de pagamento
Etapa 3: definir as redes de cartões de pagamento compatíveis
Etapa 4: descrever as formas de pagamento permitidas
Etapa 5: carregar a biblioteca JavaScript da API Google Pay
Etapa 6: determinar a disponibilidade para pagar com a API Google Pay
Etapa 7: adicionar um botão de pagamento do Google Pay
Etapa 8: criar um objeto PaymentDataRequest
Etapa 9: registrar o manipulador de eventos para o gesto do usuário
Etapa 10 (opcional): fazer uma pré-busca de dados de pagamento antes da interação do usuário
Etapa 11 (opcional): configurar Autorizar pagamentos
Etapa 12 (opcional para envio habilitado): configurar atualizações dinâmicas de preços
Etapa 13 (opcional para códigos promocionais): configurar códigos promocionais
Juntar tudo
Observação: consulte nossas demonstrações ao vivo do Google Pay.

Etapa 1: definir a versão da API Google Pay

Declare a versão da API Google Pay que o site usa. As versões principal e secundária são obrigatórias nos campos esperados em cada objeto transmitido e incluídas na resposta.

O exemplo de código a seguir mostra as versões da API declaradas:

const baseRequest = {
  apiVersion: 2,
  apiVersionMinor: 0
};

Etapa 2: solicitar um token de pagamento para seu provedor

O Google criptografa informações sobre o cartão selecionado de um pagador para garantir o processamento seguro por um provedor de pagamento.

const tokenizationSpecification = {
  type: 'PAYMENT_GATEWAY',
  parameters: {
    'gateway': 'example',
    'gatewayMerchantId': 'exampleGatewayMerchantId'
  }
};

Substitua example e exampleGatewayMerchantId pelos valores apropriados do seu provedor de pagamento. Use a tabela a seguir para encontrar os valores gateway e gatewayMerchantId específicos do seu provedor de pagamento:

Gateway	Parâmetros e documentos
ABA PayWay	"gateway": "ababank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
accept.blue	"gateway": "acceptblue" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
ACI	"gateway": "aciworldwide" "gatewayMerchantId": "`YOUR_ENTITY_ID`" Documentação do desenvolvedor
ACpay	"gateway": "acpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em chinês)
Acquired.com	"gateway": "acquired" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Adyen	"gateway": "adyen" "gatewayMerchantId": "`YOUR_MERCHANT_ACCOUNT_NAME`" Documentação do desenvolvedor (em inglês)
Airba Pay	"gateway": "airbapay" "gatewayMerchantId": "`YOUR_MERCHANT_ACCOUNT_NAME`" Documentação do desenvolvedor (em inglês)
Airvend	"gateway": "airvend" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Airwallex	"gateway": "airwallex" "gatewayMerchantId": "`YOUR_MERCHANT_ACCOUNT_NAME`" Documentação do desenvolvedor (em inglês)
Akurateco	"gateway": "akuratecolab" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Alfa-Bank	"gateway": "alfabank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Algoritma	"gateway": "algoritma" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Allinpay	"gateway": "allinpayintl" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Dokumentacja dla deweloperów (em inglês)
AllPayments	"gateway": "allpayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
alticepay	"gateway": "alticepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Anedot	"gateway": "anedot" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
ApcoPay	"gateway": "apcopay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
APPEX	"gateway": "epos" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
AsiaBill	"gateway": "asiabill" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
Assist	"gateway": "assist" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Assist Belarus	"gateway": "belassist" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Assist Kazakhstan	"gateway": "assistkz" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Aurus	"gateway": "auruspay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Axerve	"gateway": "gestpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Bank 131	"gateway": "bank131" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Bank Vostok	"gateway": "bankvostok" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Barclaycard	"gateway": "barclayssmartpayadvance" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Barion	"gateway": "barion" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
BCC.KZ	"gateway": "bccpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
bePaid	"gateway": "ecomcharge" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Bereke Bank	"gateway": "berekepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Billing Systems	"gateway": "billingsystems" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Bizzon	"gateway": "bizzon" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Blocks	"gateway": "blocks" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Bluefin	"gateway": "bluefin" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Blue Media	"gateway": "bluemedia" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em polonês)
BlueSnap	"gateway": "bluesnap" "gatewayMerchantId": "`YOUR_shopToken`" Documentação do desenvolvedor (em inglês)
BPC	"gateway": "bpcpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
BR-DGE	"gateway": "comcarde" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Braintree	"gateway": "braintree" "braintree:apiVersion": "v1" "braintree:sdkVersion": "braintree.client.`VERSION`" "braintree:merchantId": "`YOUR_BRAINTREE_MERCHANT_ID`" "braintree:clientKey": "`YOUR_BRAINTREE_TOKENIZATION_KEY`" Documentação do desenvolvedor (em inglês)
Braspag	"gateway": "cielo" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
BridgerPay	"gateway": "bridgerpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Buya	"gateway": "buya" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
CardCom	"gateway": "cardcom" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
CardConnect	"gateway": "cardconnect" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Cardknox	"gateway": "cardknox" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Cardstream	"gateway": "crst" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Cashflows	"gateway": "cashflowsgateway" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Cathay United Bank	"gateway": "cathaybk" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em mandarim)
CCAvenue UAE	"gateway": "ccavenueuae" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Cecabank	"gateway": "cecabank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Celerispay	"gateway": "celerispay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
CentralPay	"gateway": "centralpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em francês)
Chargehive	"gateway": "chargehive" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
CharityEngine	"gateway": "charityengine" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Chase: serviços para comerciantes	"gateway": "chase" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Checkout.com	"gateway": "checkoutltd" "gatewayMerchantId": "`YOUR_PUBLIC_KEY`" Documentação do desenvolvedor (em inglês)
CityPay	"gateway": "citypay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Cloud9 Payment Gateway (C9PG)	"gateway": "c9pg" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
CloudPayments	"gateway": "cloudpayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
CloudWalk	"gateway": "cloudwalk" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Computop	"gateway": "computop" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
ConcordPay	"gateway": "concordpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em ucraniano)
ConnexPay	"gateway": "connexpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Corefy	"gateway": "paycoreio" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Corvus Pay	"gateway": "corvuspay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Credorax	"gateway": "credorax" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
CrossPay	"gateway": "crosspay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
CSG Forte	"gateway": "csgforte" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
CTBC Bank	"gateway": "ctbcbank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
CURO Payments	"gateway": "curopayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Cybersource	"gateway": "cybersource" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
danube.pay	"gateway": "danubepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Datacap Systems, Inc.	"gateway": "datacap systems inc." "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Datatrans	"gateway": "datatrans" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
DECTA	"gateway":"decta" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
Deutsche Bank – Merchant Solutions	"gateway": "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
DG Financial Technology, Inc.	"gateway": "veritrans" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em japonês)
Digital Finance	"gateway": "digitalfinance" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
dLocal	"gateway": "dlocal" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
DNA Payments	"gateway": "dnapayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Dojo	"gateway": "dojo" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Dotpay	"gateway": "dotpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
e-SiTef da Software Express	"gateway": "softwareexpress" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
easycard	"gateway": "easycard" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
EasyPay	"gateway": "easypay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
EBANX	"gateway": "ebanx" "gatewayMerchantId": "`YOUR_PUBLIC_INTEGRATION_KEY`" Documentação do desenvolvedor (em inglês)
eCard	"gateway": "ecard" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
ECOMMPAY	"gateway": "ecommpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Ecopaynet	"gateway": "ecopaynet" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em espanhol)
ECPay	"gateway": "ecpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
eGHL	"gateway": "eghl" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Elavon (Converge)	"gateway": "convergepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Emerchantpay	"gateway": "emerchantpay" "gatewayMerchantID": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
emspay	"gateway": "emsonline" "gatewayMerchantID": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Encoded	"gateway": "encoded" "gatewayMerchantID": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
EpicPay	"gateway": "epicpay" "gatewayMerchantID": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Espago	"gateway": "espago" "gatewayMerchantID": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
EveryPay	"gateway": "everypay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
EVONET	"gateway": "cardinfolink" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Evopay	"gateway": "evopay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Gateway de pagamento da Evo	"gateway": "evopaymentgateway" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
exactly.com	"gateway": "exactly" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Exact Payments	"gateway": "exactpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Fat Zebra	"gateway": "fatzebra" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Fenige	"gateway": "fenige" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Fibonatix	"gateway": "fibonatixparagon" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Financial Line	"gateway": "finline" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Finanso UA	"gateway": "finansoua" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
FINEXUS	"gateway": "finexus" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Finix	"gateway": "finix" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
First American by Deluxe	"gateway": "firstpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
First Data (Payeezy)	"gateway": "firstdata" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
FIS Biller Solutions	"gateway": "fisglobalbsp" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Fluid Pay	"gateway": "fluidpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
FM Finance LTD	"gateway": "fmfinanceltd" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
ForteBank	"gateway": "fortebank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Freedom Finance Bank	"gateway": "axayscom" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
FreedomPay	"gateway": "freedompay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
FreedomPay.Money	"gateway": "payboxmoney" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Freepay	"gateway": "freepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Frontstream	"gateway": "frontstreampayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Fung Payments	"gateway": "fungpayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
GBPayments	"gateway": "gbpayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
geidea	"gateway": "geidea" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
GETTRX	"gateway": "globalelectronictechnology" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Global One Pay	"gateway": "globalonepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
Global Payments	"gateway": "globalpayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
GMO Payment Gateway	"gateway": "gmopg" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em japonês)
GoDaddy Payments	"gateway": "godaddypayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Good Idea Technologies	"gateway": "git" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
GoPay	"gateway": "gopay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em tcheco)
GP Webpay	"gateway": "gpwebpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
Gr4vy	"gateway": "gr4vy" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Gravity Payments	"gateway": "gravitypayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Halyk Bank	"gateway": "halykbank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Helcim	"gateway": "helcim" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
HIPS	"gateway": "hips" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
HiTrust	"gateway": "hitrustpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em mandarim)
Hyp	"gateway": "hyp" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
icard	"gateway": "icardwallet" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
iKhokha	"gateway": "ikhokha" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
IMOJE	"gateway": "imoje" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Impaya	"gateway": "impayarus" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
InPlat	"gateway": "inplat" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
InstaMed	"gateway": "instamed" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
IntellectMoney	"gateway": "intellectmoney" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Interactive Transaction Solutions	"gateway": "interactivets" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Interswitch Payment Gateway	"gateway": "interswitch" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Intervale	"gateway": "intervale" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
ioka fintech	"gateway": "ioka" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
iPay88	"gateway": "ipay88" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
IPSI	"gateway": "ipsi" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
iQmetrix	"gateway": "iqmetrixpaymentservicesgateway" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
IXOPAY	"gateway": "ixopay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
JetPay	"gateway": "jetpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
JudoPay	"gateway": "judopay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
Kassa	"gateway": "kassacom" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
kassa24pay	"gateway": "kassa24pay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Kineox	"gateway": "kineox" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor(em espanhol)
Klix by Citadele	"gateway": "klix" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
LHV Pank	"gateway": "lhvpank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Liberty	"gateway": "liberty" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Life Pay	"gateway": "lifepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Limepay	"gateway": "limepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
LiqPay	"gateway": "liqpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Littlepay	"gateway": "littlepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
LogPay	"gateway": "logpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Loyale	"gateway": "loyale" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
lynck	"gateway": "lynck" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Lyra	"gateway": "lyra" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em francês)
Magnetiq Bank	"gateway": "magnetiq" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
maib	"gateway": "maibecomm" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
MakeCommerce (Maksekeskus)	"gateway": "maksekeskus" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Mandarin	"gateway": "mandarin" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Market Pay	"gateway": "marketpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Mastercard Payment Gateway Services	"gateway": "mpgs" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
MerchantE	"gateway": "merchante" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Merchant Warrior	"gateway": "merchantwarrior" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Minsait Payments Systems	"gateway": "minsaitpaymentsgateway" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
MITEC	"gateway": "mitecmx" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
MIXPLAT	"gateway": "mixplat" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
MOBI.Money	"gateway": "mobimoney" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Modulbank	"gateway": "modulbank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Molpay	"gateway": "molpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
Mondido	"gateway": "mondido" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Monei	"gateway": "monei" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
monek	"gateway": "monek" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor(em inglês)
Moneris	"gateway": "moneris" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Moneta	"gateway": "moneta" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
Monext	"gateway": "monext" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Money.Mail.Ru	"gateway": "moneymailru" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
MPay	"gateway": "managepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
mstartipg	"gateway": "mstartipg" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Multicarta	"gateway": "mulitcarta" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
MultiSafepay	"gateway": "multisafepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Mundipagg	"gateway": "mundipagg" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
MyCheck	"gateway": "mycheck" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
MyChoice2Pay	"gateway": "mychoice2pay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
MyFatoorah	"gateway": "myfatoorah" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
MyPay	"gateway": "mypay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
myPOS	"gateway": "mypos" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
N&TS Group	"gateway": "netsgroup" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
NCCC	"gateway": "nccc" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Neon Pay	"gateway": "neonpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Netopia	"gateway": "netopia" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em romeno)
Netvalve	"gateway": "netvalve" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Newebpay (antiga STPath, Pay2Go)	"gateway": "newebpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em mandarim)
Newtech	"gateway": "newtechmobile" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em italiano)
Nexi	"gateway": "nexi" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em italiano)
NMI	"gateway": "gatewayservices" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
noon payments	"gateway": "noonpayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Noqoody Pay	"gateway": "noqoodypay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Novalnet	"gateway": "novalnet" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
NTT DATA	"gateway": "nttdatahk" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Nuvei	"gateway": "nuvei" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Oceanpayment	"gateway": "oceanpayment" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Omise	"gateway": "omise" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
One Inc	"gateway": "oneinc" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Onelya	"gateway": "onelya" "gatewayMerchantId": "`YOUR_GATWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Onerway	"gateway": "ronghan" "gatewayMerchantId": "`YOUR_GATWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
OneVision Limited	"gateway": "onevision" "gatewayMerchantId": "`YOUR_GATWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
OnPay	"gateway": "onpayio" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Opayo by Elavon	"gateway": "opayoelavon" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Oschadbank	"gateway": "oschadbank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
pagarme	"gateway": "pagarme" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PagBank	"gateway": "pagbank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PagBrasil	"gateway": "pagbrasil" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PagSeguro	"gateway": "pagsegurointernational" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PAY2M	"gateway": "pay2m" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Payarc	"gateway": "payarc" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Pay.com	"gateway": "paycom" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PAYCOMET	"gateway": "paycomet" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Paydock	"gateway": "paydock" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PayEase	"gateway": "payeasenet" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PayEngine	"gateway": "payengine" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PayFabric	"gateway": "payfabric" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PayFacto	"gateway": "payfacto" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
paygent	"gateway": "paygent" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Payhub	"gateway": "payhub" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PayLane	"gateway": "paylane" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Payler	"gateway": "payler" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PayLink®	"gateway": "paylink" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Payload	"gateway": "payload" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Paymark	"gateway": "paymark" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PayMaster	"gateway": "paymaster" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Payment Fusion	"gateway": "paymentfusion" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Paymentvision	"gateway": "paymentvision" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Paymentwall	"gateway": "paymentwall" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Paymo	"gateway": "paymo" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Paymob	"gateway": "gpaymob" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Paymtech	"gateway": "paymtech" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PayNearMe	"gateway": "paynearme" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Payneteasy	"gateway": "payneteasy" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Pay.nl	"gateway": "paynl" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Paynopain	"gateway": "paynopain" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PayOne	"gateway": "payone" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PayOnline	"gateway": "payonline" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Payoo	"gateway": "payoo" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PayPlus	"gateway": "payplus" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Payrails	"gateway": "payrails" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Payrexx	"gateway": "payrexx" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PayRiff	"gateway": "payriff" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Payrix	"gateway": "payrix" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Paysafe	"gateway": "paysafe" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Payscout	"gateway": "payscout" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Paysend Business	"gateway": "paysend" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Paysoft	"gateway": "paysoft" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Pay360	"gateway": "pay360" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
paytech	"gateway": "paytechsolutions" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PayTech Ukraine	"gateway": "paytech" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Paythru	"gateway": "paythru" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Payture	"gateway": "payture" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
PayU	"gateway": "payu" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PayU LATAM	"gateway": "payulatam" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PAYUNi	"gateway": "payuni" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em mandarim)
PayU Romania	"gateway": "payuro" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PayU Russia	"gateway": "payuru" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Payway	"gateway": "payway" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Paywiser	"gateway": "paywiser" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Pelecard	"gateway": "pelecard" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Pikassa	"gateway": "pikassa" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PingPong	"gateway": "pingpongx" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Pin Payments	"gateway": "pinpayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Planet	"gateway": "cccpayment" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PlanetPay	"gateway": "itcardpaymentservice" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Plategka.com	"gateway": "plategkacom" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Platon	"gateway": "platon" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Pomelo	"gateway": "pomelopay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Portmone	"gateway": "portmonecom" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Primer	"gateway": "primer" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Procard	"gateway": "procard" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
ProcessOut	"gateway": "processout" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Przelewy24	"gateway": "przelewy24" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PSB Bank	"gateway": "psbank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
PSCB	"gateway": "pscbru" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
PXP Financial	"gateway": "pxpfinancial" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Qenta Payment CEE	"gateway": "qenta" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
QIWI	"gateway": "qiwi" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Qualpay	"gateway": "qualpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
QuickPay	"gateway": "quickpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Qvalent	"gateway": "qvalent" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Radial	"gateway": "radial" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Rapyd	"gateway": "rapyd" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
RBK.money	"gateway": "rbkmoney" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Rebail Capital	"gateway": "rebailcapital" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Rebilly	"gateway": "Rebilly" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Recurly	"gateway": "recurly" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Reddot	"gateway": "reddotpayment" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Rede	"gateway": "rede" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Redsys	"gateway": "redsys" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em espanhol e inglês)
Reepay	"gateway": "reepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
RocketGate	"gateway": "rocketgate" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Russian Standard Bank	"gateway": "rsb" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Ryft	"gateway": "ryft" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Saferpay	"gateway": "worldlinesaferpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Safexpay	"gateway": "safexpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Sberbank	"gateway": "sberbank" "gatewayMerchantId": "`YOUR_ORGANIZATION_NAME`" Documentação do desenvolvedor
SEB Baltic	"gateway": "sebbaltic" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Sense Bank	"gateway": "sensebank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
SensePass	"gateway": "sensepass" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Shift4	"gateway": "shift4payments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Shiji Group	"gateway": "shijipaymentsolutions" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
SH Start High	"gateway": "shstartpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
simbasoft	"gateway": "simbasoft" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Sipay	"gateway": "sipay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Softbank Payment Service	"gateway": "sbps" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em japonês)
Solid	"gateway": "solid" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Sony Payment Services	"gateway": "sonypaymentservices" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Splitit	"gateway": "splitit" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Spreedly	"gateway": "spreedly" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Square	"gateway": "square" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
SredaPay	"gateway": "sredapay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Stancer	"gateway": "stancer" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Stripe	"gateway": "stripe" "stripe:version": "2018-10-31" "stripe:publishableKey": "`YOUR_PUBLIC_STRIPE_KEY`" Documentação do desenvolvedor
Suntech	"gateway": "esafe" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Surfboard Payments	"gateway": "surfboard" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor(em inglês)
Svea Bank	"gateway": "svea" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em svenska)
Swedbank Baltic	"gateway": "swedbankbaltic" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em svenska)
Swedbank Pay	"gateway": "payexswedbankpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
TabaPay	"gateway": "tabapay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
TapPay (Cherri Tech)	"gateway": "tappay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em mandarim)
TapPayments	"gateway": "tappayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
TAS Link	"gateway": "taslink" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em ucraniano)
Tatra banka (CardPay)	"gateway": "tatrabanka" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
TEKO	"gateway": "teko" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
theMAP	"gateway": "themap" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Till Payments	"gateway": "tillpayments"" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Tinkoff	"gateway": "tinkoff" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
TPay	"gateway": "tpaycom" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em polonês)
TPay.com	"gateway": "tpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Transact Campus	"gateway": "transactcampus" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Transaction Services Network	"gateway": "tns" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Transpayrent	"gateway": "transpayrent" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Tranzila	"gateway": "tranzila" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em hebraico e em inglês)
Tranzzo	"gateway": "tranzzo" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Tribe Payments	"gateway": "tribepayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Truevo	"gateway": "truevo" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
TrustPay	"gateway": "trustpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Trust Payments	"gateway": "trustpayments" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Tuna	"gateway": "tuna" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
2can&ibox	"gateway": "twocan" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
UAPAY	"gateway": "uapay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em ucraniano)
UBRR	"gateway": "ubrrpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Ukrcard	"gateway": "ukrcardpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
UkrGasBank Pay	"gateway": "ukrgasbankpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Unibank OJSC	"gateway": "unibankcheckout" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
unitedfinancialcorporation	"gateway": "unitedfinancialcorporation" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Uniteller	"gateway": "uniteller" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Unitpay	"gateway": "unitpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Unlimint	"gateway": "unlimint" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Unzer	"gateway": "unzer" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Unzer Austria	"gateway": "unzeraustria" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
UPC	"gateway": "upc" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Upgate	"gateway": "upgate" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
USAePay	"gateway": "usaepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
UseePay	"gateway": "useepay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Valitor	"gateway": "valitor" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Vantiv	"gateway": "vantiv" "vantiv:merchantPayPageId": "`YOUR_PAY_PAGE_ID`" "vantiv:merchantOrderId": "`YOUR_ORDER_ID`" "vantiv:merchantTransactionId": "`YOUR_TRANSACTION_ID`" "vantiv:merchantReportGroup": "*web" Documentação do desenvolvedor (em inglês)
Verestro	"gateway": "verestro" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Very Good Security	"gateway": "verygoodsecurity" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Vindicia	"gateway": "vindicia" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Viva Wallet	"gateway": "vivawallet" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
VTEX	"gateway": "vtex" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Walletdoc	"gateway": "walletdoc" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor(em ingles)
Walletto	"gateway": "walletto" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
WayForPay	"gateway": "wayforpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
WEAT	"gateway": "weatpay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
WhenThen	"gateway": "whenthen" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Windcave	"gateway": "windcave" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Wirebank	"gateway": "wirebank" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
Wirecard	"gateway": "wirecard" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
WOOPPAY	"gateway": "wooppay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em russo)
WooshPay	"gateway": "swooshtransfer" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Worldline (GlobalCollect)	"gateway": "globalcollect" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Worldline - Ingenico (WL Online Checkout)	"gateway": "worldlineingenicoogone" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Worldline Nordics (Worldline Online Checkout)	"gateway": "worldlineonlinecheckout" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Worldline Sips	"gateway": "wlsips" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Worldnet	"gateway": "worldnet" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Worldpay	"gateway": "worldpay" "gatewayMerchantId": "`YOUR_WORLDPAY_MERCHANT_ID`" Documentação do desenvolvedor
Wpay	"gateway": "wpayaus" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
WSPay	"gateway": "wspay" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
XPATE	"gateway": "xpate" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Dokumentacja dla deweloperów
xpay	"gateway": "xpaycomua" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
YIĞIM Payment System	"gateway": "yigim" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Nenhum documento do desenvolvedor está disponível
ЮKassa (YooKassa)	"gateway": "yoomoney" "gatewayMerchantId": "`YOUR_SHOP_ID`" Documentação do desenvolvedor
Z-credit	"gateway": "zcredit" "gatewayMerchantId": "`YOUR_SHOP_ID`" Documentação do desenvolvedor (em inglês)
ZEN.com	"gateway": "zen" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor
Zest	"gateway": "zestpayment" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)
Zuora	"gateway": "zuora" "gatewayMerchantId": "`YOUR_GATEWAY_MERCHANT_ID`" Documentação do desenvolvedor (em inglês)

Dica: example é um nome de gateway válido no ambiente de teste. Se você quiser testar a API, deixe o exemplo de código acima como está. Ao usar o gateway example, seu site não vai receber dados do cartão que podem ser usados para fazer transações, mas o fluxo do usuário vai ter a mesma aparência.

O tipo de tokenização PAYMENT_GATEWAYé a implementação de comerciante mais comum da forma de pagamento com cartão na API Google Pay. Caso seu provedor de pagamento não seja compatível, você poderá aceitar o Google Pay por meio de uma integração DIRECT. Para mais informações, consulte a documentação da tokenização direta.

Etapa 3: definir as redes de cartões de pagamento compatíveis

Defina as redes de cartões aceitas pelo seu site. Veja o exemplo de código a seguir:

const allowedCardNetworks = ["AMEX", "DISCOVER", "INTERAC", "JCB", "MASTERCARD", "VISA"];

A API Google Pay pode retornar cartões registrados em arquivos no Google (PAN_ONLY) e/ou um token de dispositivo em um dispositivo Android autenticado com um criptograma 3-D Secure (CRYPTOGRAM_3DS). Veja o exemplo de código a seguir:

const allowedCardAuthMethods = ["PAN_ONLY", "CRYPTOGRAM_3DS"];

Para mais informações, consulte CardParameters na documentação de referência do objeto. Além disso, verifique com o gateway ou processador quais são as redes de cartões compatíveis e se há suporte para tokens de dispositivos Android.

Etapa 4: descrever as formas de pagamento permitidas

Para descrever as formas de pagamento permitidas, siga estas etapas:

Combine os métodos de autenticação e as redes de cartões compatíveis para descrever o suporte do site à forma de pagamento CARD. Veja o exemplo de código a seguir:

const baseCardPaymentMethod = {
  type: 'CARD',
  parameters: {
    allowedAuthMethods: allowedCardAuthMethods,
    allowedCardNetworks: allowedCardNetworks
  }
};

Estenda o objeto da forma de pagamento por cartão base para descrever as informações que precisam ser retornadas ao aplicativo. Inclua uma descrição dos dados de pagamento tokenizados. Veja o exemplo de código a seguir:
```
const cardPaymentMethod = Object.assign(
  {tokenizationSpecification: tokenizationSpecification},
  baseCardPaymentMethod
);
```

Para mais informações sobre parameters compatível, consulte CardParameters.

O Google Pay também oferece suporte ao tipo CARD e à forma de pagamento do tipo PAYPAL. Para mais detalhes sobre como adicionar o tipo PAYPAL como forma de pagamento ao Google Pay, consulte a documentação do desenvolvedor do PayPal.

Etapa 5: carregar a biblioteca JavaScript da API Google Pay

Para carregar a biblioteca JavaScript da API Google Pay, conclua as seguintes etapas:

Inclua o JavaScript hospedado do Google em sua página. Veja o exemplo de código a seguir:

<script
  async
  src="https://pay.google.com/gp/p/js/pay.js"
  onload="console.log('TODO: add onload function')">
</script>

Depois que a biblioteca JavaScript da API Google Pay for carregada, inicialize um objeto PaymentsClient. O desenvolvimento inicial usa um ambiente TEST, que retorna formas de pagamento fictícias adequadas para referenciar a estrutura de uma resposta de pagamento. Nesse ambiente, uma forma de pagamento selecionada não é capaz de fazer uma transação. Veja o exemplo de código a seguir:
Observação: recomendamos que você inicialize o paymentsClient apenas uma vez. Use a mesma instância ao invocar todas as outras APIs, como CreateButton, IsReadyToPay, PrefetchPaymentData e LoadPaymentData.
```
const paymentsClient =
    new google.payments.api.PaymentsClient({environment: 'TEST'});
```
Para mais informações sobre os requisitos de um ambiente PRODUCTION que retorna formas de pagamento sujeitas à cobrança, consulte a lista de verificação de integração.

Etapa 6: determinar a disponibilidade para pagar com a API Google Pay

Para determinar a disponibilidade para pagar com a API Google Pay, conclua as seguintes etapas:

Adicione as formas de pagamento permitidas ao objeto de solicitação base. Veja o exemplo de código a seguir:

const isReadyToPayRequest = Object.assign({}, baseRequest);
isReadyToPayRequest.allowedPaymentMethods = [baseCardPaymentMethod];

Chame isReadyToPay() e determine se a API Google Pay é compatível com os dispositivo e navegador atuais para as formas de pagamento especificadas. Veja o exemplo de código a seguir:

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);
    });

Etapa 7: adicionar um botão de pagamento do Google Pay

Adicione um botão de pagamento do Google Pay à sua página para incentivar os compradores a conferir as formas de pagamento compatíveis com a API Google Pay e o seu site. Para mais informações sobre os tipos de botões, cores e requisitos de exibição disponíveis, consulte as diretrizes da promoção de marca.

Veja o seguinte exemplo de código do botão de pagamento:

const button =
    paymentsClient.createButton({onClick: () => console.log('TODO: click handler'),
    allowedPaymentMethods: []}); // make sure to provide an allowed payment method
document.getElementById('container').appendChild(button);

Etapa 8: criar um objeto PaymentDataRequest

Para criar um objeto PaymentDataRequest, siga as instruções a seguir:

Crie um objeto JavaScript que descreva o suporte do seu site à API Google Pay. Para uma lista completa das propriedades compatíveis, consulte PaymentDataRequest. Veja o exemplo de código a seguir:
```
const paymentDataRequest = Object.assign({}, baseRequest);
```
Adicione as formas de pagamento compatíveis com seu aplicativo, como qualquer configuração de outros dados esperados na resposta. Veja o exemplo de código a seguir:
```
paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod];
```
Defina um preço total e uma moeda para um comprador autorizar. Veja o exemplo de código a seguir:
Importante: comerciantes que processam transações no Espaço Econômico Europeu (EEE) ou em qualquer outro país sujeito à Autenticação Segura do Cliente (SCA) precisa incluir os parâmetros countryCode, totalPrice e merchantName para atender aos requisitos de SCA.
```
paymentDataRequest.transactionInfo = {
  totalPriceStatus: 'FINAL',
  totalPrice: '123.45',
  currencyCode: 'USD',
  countryCode: 'US'
};
```
Forneça um nome de comerciante visível ao usuário e use nosso valor TEST merchantId quando em TEST. Para mais detalhes e informações sobre quando substituir o valor TEST merchantId, consulte MerchantInfo. Veja o seguinte exemplo de código de um nome de comerciante visível ao usuário:
```
paymentDataRequest.merchantInfo = {
  merchantName: 'Example Merchant'
  merchantId: '12345678901234567890'
};
```
Observação: nosso valor TEST merchantId é numérico. Seu valor merchantId específico pode ser numérico ou alfanumérico. Consulte MerchantInfo para mais detalhes sobre como conseguir seu merchantId específico.

Etapa 9: registrar o manipulador de eventos para gestos do usuário

Para registrar um manipulador de eventos para gestos do usuário, conclua as seguintes etapas:

Registre um manipulador de eventos de clique para o botão de compra. O manipulador de eventos chama loadPaymentData() imediatamente após interagir com o botão de pagamento do Google Pay.
Processe a resposta da API Google Pay depois que um usuário do Google conceder permissão para que seu site receba informações sobre a forma de pagamento e dados de contato opcionais do usuário.
Extraia o token de pagamento da resposta paymentData. Se você implementar uma integração de gateway, passe esse token para o gateway sem nenhuma modificação.
Observação: em um ambiente TEST, uma resposta de pagamento inclui dados resumidos sobre a forma de pagamento selecionada que pode ser exibida em uma página de confirmação. A resposta de pagamento não inclui uma forma de pagamento capaz de efetuar uma transação.
```
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);
});
```

Etapa 10 (opcional): fazer uma pré-busca de dados de pagamento antes da interação do usuário

Para melhorar o tempo de execução, faça uma pré-busca da configuração de pagamento do seu site na API Google Pay antes de chamar loadPaymentData(). Veja o exemplo a seguir:

paymentsClient.prefetchPaymentData(paymentDataRequest);

Etapa 11 (opcional): configurar Autorizar pagamentos

A opção Autorizar pagamentos é usada para iniciar o processo de pagamento e confirmar o status de autorização de um pagamento. Para fazer a configuração, siga as instruções abaixo:

Registre um callback onPaymentAuthorized() em PaymentOptions.
Chame a função loadPaymentData() com o intent de callback PAYMENT_AUTHORIZATION.
Implemente onPaymentAuthorized().

Registrar-se nos callbacks onPaymentAuthorized

O exemplo de código a seguir mostra como registrar callbacks onPaymentAuthorized:

{
  environment: "TEST",
  merchantInfo: {
    merchantName: "Example Merchant",
    merchantId: "12345678901234567890"
  },
  paymentDataCallbacks: {
    onPaymentAuthorized: onPaymentAuthorized
  }
}

Carregar dados de pagamento com intents de callback

O exemplo de código a seguir mostra como inicializar a planilha de pagamento com Autorizar pagamentos:

const paymentDataRequest = Object.assign({}, baseRequest);
paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod];
paymentDataRequest.transactionInfo = getGoogleTransactionInfo();
paymentDataRequest.merchantInfo = {
  merchantName: 'Example Merchant'
  merchantId: '12345678901234567890',
};

paymentDataRequest.callbackIntents = ["PAYMENT_AUTHORIZATION"];

Processar callbacks onPaymentAuthorized

O callback onPaymentAuthorized() é chamado pelo Google com um objeto PaymentData depois que um pagador aprova o pagamento usando um gesto do usuário, como se ele clicasse em Pagar.

O callback retorna um valor Promise<PaymentAuthorizationResult>. O objeto PaymentAuthorizationResult tem um status de estado de transação SUCCESS ou ERROR. Após a conclusão, a página de pagamento vai ser fechada. Se ocorrer um erro, a página de pagamento processará os detalhes do erro retornados após o processamento do pagamento. O usuário pode alterar os dados do pagamento da página de pagamento e autorizá-lo novamente. Veja o exemplo de código a seguir:

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'
        }
      });
    });
  });
}

Etapa 12 (opcional para envio habilitado): configurar Atualizações dinâmicas de preços

As atualizações dinâmicas de preços permitem que o comerciante atualize de maneira dinâmica as opções de envio e as informações da transação de acordo com o endereço de entrega escolhido. Além disso, é possível atualizar de maneira dinâmica as informações da transação de acordo com a opção de envio escolhida.

Para configurar as atualizações dinâmicas de preços, siga as etapas abaixo:

Registre os callbacks onPaymentAuthorized e onPaymentDataChanged em PaymentOptions.
Chame a função loadPaymentData() com intents de callback. Para detalhes, consulte o exemplo correspondente.
Implemente onPaymentAuthorized e onPaymentDataChanged.

Registrar o callback PaymentData

O exemplo de código a seguir mostra que as atualizações dinâmicas de preços exigem que as funções de callback sejam registradas no objeto PaymentsClient paymentOptions.

{
  environment: "TEST",
  merchantInfo: {
    merchantName: "Example Merchant",
    merchantId: "12345678901234567890"
  },
  paymentDataCallbacks: {
    onPaymentAuthorized: onPaymentAuthorized,
    onPaymentDataChanged: onPaymentDataChanged
  }
}

Carregar dados de pagamento com intents de callback

No exemplo de código a seguir, mostramos como uma página de pagamento será inicializada com a configuração de opções de envio e endereço de entrega obrigatórios:

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;

Processar o callback onPaymentDataChanged

O callback onPaymentDataChanged é chamado com um objeto IntermediatePaymentData, que inclui o endereço e a opção de envio selecionados na página de pagamento.

O callback retorna um Promise<PaymentDataRequestUpdate>. O objeto PaymentDataRequestUpdate tem novas informações de transação, opções de envio e um erro de dados de pagamento. Esses dados atualizam a página de pagamento.

Use a página de pagamento para processar diretamente todos os casos de exceção, como um endereço de entrega não utilizável ou uma opção de envio inválida. Configure um objeto PaymentDataError para destacar o motivo do erro com uma mensagem de erro para o usuário. Lembre-se de incluir na mensagem o intent relacionado. Para detalhes sobre como configurar o objeto e a mensagem, consulte o exemplo de código a seguir:

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);
  });
}

Os códigos promocionais permitem que um comerciante atualize de maneira dinâmica as opções de envio e as informações da transação de acordo com o código promocional fornecido.

Para configurar códigos promocionais, siga estas etapas:

Registre os callbacks onPaymentDataChanged em PaymentOptions.
Chame a função loadPaymentData() com intents de callback. Para detalhes, consulte o exemplo correspondente.
Implemente onPaymentDataChanged callback function.

Registrar o callback "Oferta"

O exemplo de código a seguir mostra que os códigos promocionais exigem que as funções de callback sejam registradas no objeto PaymentsClient paymentOptions.

{
  environment: "TEST",
  merchantInfo: {
    merchantName: "Example Merchant",
    merchantId: "12345678901234567890"
  },
  paymentDataCallbacks: {
    onPaymentDataChanged: onPaymentDataChanged
  }
}

Carregar dados de pagamento com intents de callback

O exemplo de código a seguir mostra como uma página de pagamento precisa ser inicializada com uma intent de callback OFFER:

const paymentDataRequest = Object.assign({}, baseRequest);
paymentDataRequest.allowedPaymentMethods = [cardPaymentMethod];
paymentDataRequest.transactionInfo = getGoogleTransactionInfo();
paymentDataRequest.merchantInfo = {
  merchantId: '12345678901234567890',
  merchantName: 'Example Merchant'
};

paymentDataRequest.callbackIntents = ["OFFER"];

Processar o callback onPaymentDataChanged

O callback onPaymentDataChanged é chamado com um objeto IntermediatePaymentData, que inclui o endereço e a opção de envio selecionados na página de pagamento.

O callback precisa retornar um Promise<PaymentDataRequestUpdate>. O objeto PaymentDataRequestUpdate tem novas informações de transação, opções de envio, dados da oferta e um erro de dados de pagamento. Esses dados atualizam a página de pagamento.

Use a página de pagamento para processar diretamente todos os casos de exceção, como um código promocional inválido. Configure um objeto PaymentDataError para destacar o motivo do erro com uma mensagem de erro para o usuário. Lembre-se de incluir na mensagem o intent relacionado. Para detalhes sobre como configurar o objeto e a mensagem, consulte o exemplo de código a seguir, que faz referência a um objeto (validPromoCodes) que contém os valores de código promocional:

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);
        }
      }
    }

Juntar tudo

Os blocos de código de exemplo nesta seção mostram um exemplo completo do tutorial da biblioteca JavaScript da API Google Pay, autorizar pagamentos, atualizações dinâmicas de preços e códigos promocionais.

Tutorial

<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
  paymentToken = paymentData.paymentMethodData.tokenizationData.token;
}</script>
<script async
  src="https://pay.google.com/gp/p/js/pay.js"
  onload="onGooglePayLoaded()"></script>

Autorizar pagamentos

<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>

Atualizações dinâmicas de preço

<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>

Ofertas

<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>

Tutorial

Etapa 1: definir a versão da API Google Pay

Etapa 2: solicitar um token de pagamento para seu provedor

Etapa 3: definir as redes de cartões de pagamento compatíveis

Etapa 4: descrever as formas de pagamento permitidas

Etapa 5: carregar a biblioteca JavaScript da API Google Pay

Etapa 6: determinar a disponibilidade para pagar com a API Google Pay

Etapa 7: adicionar um botão de pagamento do Google Pay

Etapa 8: criar um objeto PaymentDataRequest

Etapa 9: registrar o manipulador de eventos para gestos do usuário

Etapa 10 (opcional): fazer uma pré-busca de dados de pagamento antes da interação do usuário

Etapa 11 (opcional): configurar Autorizar pagamentos

Registrar-se nos callbacks onPaymentAuthorized

Carregar dados de pagamento com intents de callback

Processar callbacks onPaymentAuthorized

Etapa 12 (opcional para envio habilitado): configurar Atualizações dinâmicas de preços

Registrar o callback PaymentData

Carregar dados de pagamento com intents de callback

Processar o callback onPaymentDataChanged

Etapa 13 (opcional para códigos promocionais): configurar códigos promocionais

Registrar o callback "Oferta"

Carregar dados de pagamento com intents de callback

Processar o callback onPaymentDataChanged

Juntar tudo

Tutorial

Autorizar pagamentos

Atualizações dinâmicas de preço

Ofertas