Google Pay™
Una ewallet digital disponible en Android, iOS y en la web
Google Pay es una eWallet digital que se puede usar con una cuenta de Google. Google Pay permite a los usuarios añadir su tarjeta de crédito/débito o una cuenta bancaria y realizar pagos en línea. Puede añadir una opción de Google Pay a su sitio web para que los usuarios puedan pagar con Google.
Cuando un cliente desee realizar un pago en línea, seleccionará Google Pay, el método de pago adecuado y enviará su pago.
El usuario selecciona Google Pay para realizar el pago.
Se muestra al cliente el cuadro de diálogo original de Google Pay. Si no ha iniciado sesión, el cliente ingresará los detalles.
Tras iniciar sesión correctamente, el usuario seleccionará un método de pago y la información de envío.
Si el cliente necesita añadir su método de pago, deberá hacerlo siguiendo las instrucciones del formulario de Google Pay.
El usuario selecciona Pagar.
Si la 3DS está habilitada, a continuación, se genera una solicitud de autenticación. El cliente completará la autenticación de la 3DS.
El pago se autoriza y el usuario ve una pantalla de confirmación (pago correcto o error) para resumir los detalles de pago y presiona ok.
Details | Description |
|---|---|
Categoría método de pago | eWallet |
País | Andorra, Austria, Bélgica, Bosnia y Herzegovina, Bulgaria, Croacia, Chipre, República Checa, Dinamarca, Estonia, Finlandia, Francia, Georgia, Alemania, Gibraltar, Grecia, Groenlandia, Hungría, Islandia, Irlanda, Italia, Letonia, Liechtenstein, Lituania, Luxemburgo, Macedonia, Malta, Moldavia, Mónaco, Montenegro, Países Bajos, Irlanda del Norte, Noruega, Polonia, Rumania, San Marino, República Eslovaca (Eslovaquia), Suecia, Suiza, Turquía, Reino Unido, Vaticano |
Moneda de presentación | EUR, GBP, ISK, USD, |
Reembolsos o revocaciones: | sí |
Pagos periódicos: | sí |
Disputas/contracargos: | sÍ |
Límites de transacción: | Puede depender del país o del método de pago con tarjeta vinculada |
Plazo de liquidación: | 2-3 días |
Guías |
Campos del método de pago de Google Pay
Campo | Descripción |
|---|---|
payment_method.number | Número del token o número de identificación del método de pago. |
payment_method.expiration_month | El mes en que se produce la caducidad de la tarjeta. Relevante para las tarjetas. |
payment_method.expiration_year | El año en que se produce la caducidad de la tarjeta. Relevante para las tarjetas. |
pan_type | Tipo de autenticación. Una de las siguientes opciones:
|
payment_method_options.cavv | Hash del número de tarjeta, fecha de caducidad y CVV. Solo lectura. Relevante para las tarjetas. |
payment_method_options.eci | Indicador de la industria de tarjetas electrónicas: Visa o Mastercard. |
El Rapyd Hosted Checkout es una página segura que puede generar para integrarla en su carrito de compras. Al incorporar la página Hosted Checkout a su flujo de trabajo de usuario, hay dos opciones:
Página completa (redireccionar)
Toolkit de integración (iframe)
Asegúrese de completar los pasos de la página de integración de Hosted Checkout para personalizar su experiencia de pago.
Generar la página Hosted Checkout
Si el tipo de método de pago es Google Pay, el cliente debe abrir la página de pago en una sola ventana del navegador.
Solicitud
Crear página de pago describe los parámetros de la solicitud.
JSON
{ "amount": 100, "complete_payment_url": "http://example.com/complete", "country": "SG", "currency": "SGD", "customer": "cus_9761efaa881b6edeab25e9fbfec1ddf5", "error_payment_url": "http://example.com/error", "merchant_reference_id": "0912-2021", "language": "en", "metadata": { "merchant_defined": true }, "payment_method_types_include": [ "by_visa_card" ], "expiration": 1632027189 }
Respuesta
La siguiente respuesta muestra la redirect_url para mostrar la página de Hosted Checkout para que el usuario final seleccione el botón Google Pay e inicie un pedido con Google Pay. Objeto de página de pago describe los campos de la respuesta.
Consulte Crear página de pago para obtener una respuesta completa.
JSON
{ "status": { "error_code": "", "status": "SUCCESS", "message": "", "response_code": "", "operation_id": "4482961e-7732-49dc-8d0a-2c79491210a3" }, "data": { "id": "checkout_408606a46b1e1e60507a2b2fc578143c", "status": "NEW", "language": "en", "merchant_color": "323fff", "merchant_logo": null, "merchant_website": "https://rapyd.net", "merchant_customer_support": {}, "merchant_alias": "Rapyd", "merchant_terms": null, "merchant_privacy_policy": null, "page_expiration": 1632643036, "redirect_url": "https://sandboxcheckout.rapyd.net?token=checkout_408606a46b1e1e60507a2b2fc578143c", "merchant_main_button": "place_your_order", "cancel_checkout_url": "https://rapyd.net", "complete_checkout_url": "https://rapyd.net", "country": "GB", "currency": "EUR", "amount": 100, "payment": { "amount": 100, "currency": "USD", "description": "Google Pay test payment", }, "expiration": 1632027189, "captured": false, "refunded": false, "refunded_amount": 0, "receipt_email": null, "redirect_url": null, "complete_payment_url": "http://example.com/complete", "error_payment_url": "http://example.com/error", "receipt_number": null, "flow_type": null, "address": null, "statement_descriptor": null, "transaction_id": null, "created_at": 0, "updated_at": 0, "metadata": { "merchant_defined": true }, ... } // Full response is show in the Reference Guide
Recuperar la página de finalizar pago
Utilice Recuperar la página de pago para recopilar información sobre la ewallet de Google Pay.
JSON
{ "status": { "error_code": "", "status": "SUCCESS", "message": "", "response_code": "", "operation_id": "4482961e-7732-49dc-8d0a-2c79491210a3" }, "data": { "id": "checkout_408606a46b1e1e60507a2b2fc578143c", "status": "NEW", "language": "en", "merchant_color": "323fff", "merchant_logo": null, "merchant_website": "https://rapyd.net", "merchant_customer_support": {}, "merchant_alias": "Rapyd", "merchant_terms": null, "merchant_privacy_policy": null, "page_expiration": 1632643036, "redirect_url": "https://sandboxcheckout.rapyd.net?token=checkout_408606a46b1e1e60507a2b2fc578143c", "merchant_main_button": "place_your_order", "cancel_checkout_url": "https://rapyd.net", "complete_checkout_url": "https://rapyd.net", "country": "GB", "currency": "EUR", "amount": 100, "payment": { "amount": 100, "currency": "USD", "description": "Google Pay test payment", "payment_method": { "type": "by_visa_card", "metadata": {}, "expiration": 1632027189, "captured": false, "refunded": false, "refunded_amount": 0, "receipt_email": null, "redirect_url": null, "complete_payment_url": "http://example.com/complete", "error_payment_url": "http://example.com/error", "receipt_number": null, "flow_type": null, "address": null, "statement_descriptor": null, "transaction_id": null, "created_at": 0, "updated_at": 0, "metadata": { "merchant_defined": true }, "failure_code": null, "failure_message": null, "paid": false, "paid_at": 0, "dispute": null, "refunds": null, "order": null, "outcome": null, "visual_codes": {}, "textual_codes": {}, "instructions": {}, "ewallet_id": null, "ewallets": [], "payment_method_options": {}, "payment_method_type": null, "payment_method_type_category": null, "fx_rate": null, "merchant_requested_currency": null, "merchant_requested_amount": null, "fixed_side": null, "payment_fees": null, "invoice": null, "escrow": null, "group_payment": null, "cancel_reason": null, "initiation_type": "customer_present", "mid": null, "next_action": "not_applicable" }, "payment_method_type": null, "payment_method_type_categories": null, "payment_method_types_include": [ ], "payment_method_types_exclude": null, "customer": null, "custom_elements": { "save_card_default": false, "display_description": false, "payment_fees_display": true, "merchant_currency_only": false, "billing_address_collect": false, "dynamic_currency_conversion": false }, "timestamp": 1631433436, "payment_expiration": null, "cart_items": [], "escrow": null, "escrow_release_days": null "payment_method_types": [ { "category": "ewallet", "order": 0, "types": [ { "type": "google_pay", "card_type": null, "network": VISA, "order": 0, "image": null, "instructions": [], "name": "Google Pay", "fields": [], "supported_currencies": [ "EUR" ], "payment_method_options": [], "supported_digital_wallet_providers": ["google_pay"], "digital_wallet_providers_details": { "google_pay": { "provider_type": "google_pay", "provider_name": "", "provider_default_merchant_id": "BCR2DN4TTCXOFL2X", "organization_provider_id": "", "provider_metadata": {} } } "min_amount": null, "max_amount": null, "is_redirect": false } ] } ] } }
Integre la página de pago en su sitio web con Google Pay disponible.
Pasos para integrar el Toolkit
Añada el siguiente código a su página de finalizar pago:
Añada el tag
<script>con la URL de la Rapyd Checkout Toolkit:Producción
<script src="https://checkouttoolkit.rapyd.net"></script>
Sandbox
<script src="https://sandboxcheckouttoolkit.rapyd.net"></script>
Añada el tag
<div>con id="rapyd-toolkit":<div id="rapyd-checkout"></div>
Inicie la página de finalizar pago con los siguientes campos:
JavaScript
Instantiating ‘checkout’ with parametersInstantiating 'checkout' & setting variables let checkout = new RapydCheckoutToolkit({ pay_button_text: "Click to pay", // Text that appears on the 'Pay' button. // String. Maximum length is 16 characters. // Default is "Place Your Order". Optional. pay_button_color: "blue", // Color of the 'Pay' button. String. // Standard CSS color name or hexadecimal code such as #323fff. // Default is the color that is returned in the 'merchant_color' // field of the response to 'Create Checkout Page'. Optional. id: "checkout_9ebe58dcb9d75e8f972a35350f96c2fa", // ID of the 'Create Checkout Page' response. String. Required. close_on_complete: true, // Causes the embedded Rapyd Checkout Toolkit window to close // when the payment is complete. Boolean. Default is 'true'. Optional. page_type: “collection” // Default is "collection". Optional. });
Denomine al Display Toolkit () para mostrar la página de Hosted Checkout.
checkout.displayCheckout();
Introduzca el código que se ejecuta cuando se producen los siguientes eventos. Use su código para leer el campo del evento en el objeto de la ventana.
JavaScript
window.addEventListener('onCheckoutPaymentSuccess', (event) => { console.log(event.detail) // Returns 'Payment' object. // Client code. }) window.addEventListener('onCheckoutFailure', (event) => { console.error(event.detail.error) // Returns an error message from the API. // Checkout page failed to generate // Client code. }) window.addEventListener('onCheckoutPaymentFailure', (event) => { console.error(event.detail.error) // Returns an error message from the API. // Client code. }) window.addEventListener('onLoading', (event) => { console.log(event.detail.loading) // returns true or false depending on the loading state // client code })
Si el pago se ha realizado correctamente
Cuando el pago se realiza correctamente, los clientes reciben un evento OnCheckoutPaymentSuccess con el objeto de pago con el campo: «digital_wallet» y el valor: «google_pay» para el objeto de pago en ese caso. Con Google Pay, el iframe permanece abierto y mostrará una página de confirmación final.
Probar el Toolkit integrado de la Rapyd Checkout
Este es un ejemplo de una página de Rapyd Checkout creada con el Toolkit:
HTML
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Rapyd Checkout Toolkit</title> </head> <body> <h1>Rapyd Checkout Toolkit Demo</h1> <div id="loader">Loading...</div> <div id="error" style="display: none;"></div> <div style="width: 500px" id="rapyd-checkout"></div> <script> const fileref = document.createElement("link"); fileref.rel = "stylesheet"; fileref.type = "text/css"; fileref.href = "RapydCheckoutToolkitDemo.css"; document.getElementsByTagName("head")[0].appendChild(fileref); </script> <script src="https://sandboxcheckouttoolkit.rapyd.net"></script> <script> let checkout = new RapydCheckoutToolkit({ pay_button_text: "Click to pay", pay_button_color: "blue", id: "checkout_4d7419fc75a721ec2cf39e80e9e20d26" }); checkout.displayCheckout(); window.addEventListener('onLoading', (event) => { if (event.detail.loading === false) { const loader = document.getElementById('loader'); loader.style.display = 'none'; } }); window.addEventListener('onCheckoutPaymentSuccess', function (event) { console.log(event.detail) }); window.addEventListener('checkoutOnFailed', function (event) { const loader = document.getElementById('error'); loader.style.display = ''; loader.style.color = 'red'; loader.innerText = event.detail.error; }); window.addEventListener('onCheckoutPaymentFailure', function (event) { console.log(event.detail.error) }); </script> </body> </html>