Descripción general de las apps de pago basadas en la Web

Cómo integrar tu app de pagos basada en la Web con Pagos web y brindar una mejor experiencia del usuario a los clientes.

Los pagos web llevan a la Web una interfaz integrada del navegador que permite a los usuarios ingresar la información de pago requerida con más facilidad que nunca. Las APIs pueden invocar apps de pago basadas en la Web, así como apps de pago para Android.

Navegadores compatibles

Los pagos web constan de diferentes tecnologías y el estado de compatibilidad depende del navegador.

Chromium Safari Firefox
Computadoras Android Computadoras Dispositivos móviles Computadoras de escritorio o dispositivos móviles
API de Payment Request
API de Payment Handler
App de pagos para iOS y Android ✔* ✔*

Beneficios de las apps de pagos basadas en la Web

Flujo de confirmación de la compra con una app de pagos basada en la Web
  • Los pagos se realizan por medios modales, en el contexto del sitio web del comercio, lo que proporciona una mejor experiencia del usuario que las técnicas típicas de apps de pagos que usan redireccionamientos o ventanas emergentes.
  • Las APIs de pagos web se pueden integrar en sitios web establecidos, lo que te permite aprovechar la base de usuarios existente.
  • A diferencia de las apps específicas de la plataforma, las apps de pago basadas en la Web no necesitan instalarse con anticipación.

¿Cómo funciona una app de pagos basada en la Web?

Las apps de pago basadas en la Web se compilan con tecnologías web estándar. Todas las apps de pagos basadas en la Web deben incluir un service worker.

En una app de pagos basada en la Web, un service worker puede actuar como mediador para las solicitudes de pago de la siguiente manera:

  • Abrir una ventana modal y mostrar la interfaz de la app de pagos
  • Conectando la app de pagos con el comercio
  • Obtener una autorización del cliente y pasar la credencial de pago al comercio

Obtén información sobre cómo funciona una app de pagos en un comercio en Ciclo de una transacción de pago.

Cómo descubren tu app de pagos los comercios

Para que un comercio pueda usar tu app de pagos, debe usar la API de Payment Request y especificar la forma de pago que admites con el identificador de forma de pago.

Si tienes un identificador de forma de pago único para tu app de pagos, puedes configurar tu propio manifiesto de forma de pago y permitir que los navegadores descubran tu app.

Descubre cómo funciona y cómo puedes establecer una forma de pago nueva en Configura una forma de pago.

APIs que puedes usar dentro de la ventana del controlador de pago

Una "ventana del controlador de pagos" es una ventana en la que se inician las apps de pagos. En Chrome, ya que es una ventana normal del navegador Chrome, la mayoría de las APIs web deberían funcionar como si se usaran en un documento de nivel superior, con solo algunas excepciones:

  • El cambio de tamaño del viewport está inhabilitado.
  • window.open() está inhabilitada.

Compatibilidad con WebAuthn

WebAuthn es un mecanismo de autenticación basado en la criptografía de clave pública. Puedes permitir que los usuarios accedan con una verificación biométrica. WebAuthn ya es compatible con la ventana del controlador de pagos en Chrome, y el organismo estándar está intentando crear una conexión aún más estrecha entre Web Payments y WebAuthn.

Compatibilidad con la API de Credential Management

La API de Credential Management proporciona una interfaz programática entre el sitio y el navegador para permitir un acceso fluido en todos los dispositivos. Puedes permitir que los usuarios accedan a tu sitio web automáticamente según la información almacenada en el administrador de contraseñas del navegador. Está planificado habilitarse en Chrome, aunque aún está en desarrollo.

Compatibilidad con WebOTP

La API de WebOTP te ayuda a obtener de manera programática una OTP a partir de un mensaje SMS y verificar un número de teléfono del usuario con mayor facilidad. Está planificado habilitarse en Chrome, aunque aún está en desarrollo.

Puedes consultar la lista de problemas conocidos y funciones que planeamos agregar a la ventana del controlador de pagos en la Herramienta de seguimiento de errores de Chromium.

Próximos pasos

Para comenzar a compilar una app de pagos basada en la Web, debes implementar tres partes distintas: