Demostraciones en vivo de Google Pay

En esta página, se incluyen demostraciones en vivo de Google Pay que puedes editar en JavaScript o JSFiddle.

Ejemplo básico

En el siguiente ejemplo, se muestra un uso 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 del botón

En el siguiente ejemplo, se muestra cómo puedes cambiar el tamaño del botón de Google Pay. Llama a createButton con la propiedad buttonSizeMode establecida en fill y, luego, establece 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 tal vez quieras autorizar un pago antes de procesarlo es para darle al usuario la oportunidad de elegir una forma de pago diferente si falla la autorización.

Para controlar la solicitud de autorización de pago, sigue estas instrucciones:

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

Haz clic en el vínculo Edit in JSFiddle para editarlo y probarlo por tu cuenta.

Ejemplo de actualización de precios dinámicos

Las actualizaciones dinámicas de precios te permiten ajustar de forma dinámica 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 de precios dinámicas:

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

Haz clic en el vínculo Edit in JSFiddle para editarlo y probarlo por tu cuenta.