Demos en directo de Google Pay

Esta página contiene demostraciones activas de Google Pay que puedes editar en JavaScript o JSFiddle.

Ejemplo básico

A continuación, se muestra un ejemplo básico del botón de Google Pay en acción. Consulta el código adyacente para ver un ejemplo de cómo se construye.

Ejemplo de cambio de tamaño de un botón

A continuación, se muestra cómo puedes cambiar el tamaño del botón de Google Pay. Llama a createButton con la propiedad buttonSizeMode definida como fill y, a continuación, define un tamaño en #container div.

Ejemplo de Authorize Payments

A continuación, se muestra un ejemplo de cómo puedes autorizar un pago antes de procesarlo.

El motivo por el que puedes querer autorizar un pago antes de procesarlo es para dar al usuario la oportunidad de elegir otro método de pago si la autorización falla.

Para gestionar la solicitud de autorización de pago, siga estas instrucciones:

  1. Registra una retrollamada de onPaymentAuthorized() en PaymentOptions.
  2. Llama a la función loadPaymentData() con el intent de retrollamada PAYMENT_AUTHORIZATION.
  3. Implementa el controlador de retrollamada onPaymentAuthorized().

Haz clic en el enlace Editar en JSFiddle para editarlo y probarlo.

Ejemplo de actualización dinámica de precios

La función de actualización dinámica de precios le permite ajustar dinámicamente el precio total para reflejar los cambios en la dirección de envío y en la opción de envío.

Sigue estos pasos para configurar las actualizaciones dinámicas de precios:

  1. Registra las retrollamadas de onPaymentAuthorized y onPaymentDataChanged en PaymentOptions.
  2. Llama a la función loadPaymentData() con intents de retrollamada. Para obtener más información, consulta el ejemplo correspondiente.
  3. Implementa onPaymentAuthorized y onPaymentDataChanged.

Haz clic en el enlace Editar en JSFiddle para editarlo y probarlo.