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

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

Web Payments lleva a la Web una interfaz integrada en el 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 en la Web constan de varias tecnologías diferentes, y el estado de compatibilidad depende del navegador.

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

Beneficios de las apps de pagos basadas en la Web

Flujo de confirmación de compra con una app de pagos basada en la Web.
  • Los pagos se realizan en ventanas modales, en el contexto del sitio web del comercio, lo que proporciona una mejor experiencia del usuario que las técnicas típicas de las apps de pago que usan redireccionamientos o ventanas emergentes.
  • Las APIs de Web Payments se pueden integrar en sitios web establecidos, lo que te permite aprovechar la base de usuarios existente.
  • A diferencia de las apps específicas para plataformas, las apps de pagos 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 las tecnologías web estándares. Todas las apps de pago 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 de las solicitudes de pago de las siguientes maneras:

  • Abre una ventana modal y muestra la interfaz de la app de pagos.
  • Conectar la comunicación entre la app de pagos y 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 vida de una transacción de pago.

Cómo descubren los comercios tu app de pagos

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

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

Obtén más información sobre cómo funciona y cómo puedes configurar una nueva forma de pago en Cómo configurar una forma de pago.

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

Una "ventana del controlador de pagos" es una ventana en la que se inician las apps de pagos. En Chrome, dado 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:

  • Se inhabilitó el cambio de tamaño de la ventana gráfica.
  • 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 a través de una verificación biométrica. WebAuthn ya es compatible con la ventana del controlador de pagos en Chrome, y el organismo de estándares está analizando la posibilidad de crear una conexión aún más estrecha entre los pagos en la Web 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 acceder sin problemas en todos los dispositivos. Puedes permitir que los usuarios accedan automáticamente a tu sitio web en función de la información almacenada en el administrador de contraseñas del navegador. Se planea habilitar en Chrome, pero aún está en desarrollo.

Compatibilidad con WebOTP

La API de WebOTP te ayuda a obtener de forma programática un OTP de un mensaje SMS y a verificar el número de teléfono del usuario con mayor facilidad. Se planea habilitar en Chrome, pero aún está en desarrollo.

Puedes consultar la lista de problemas conocidos y las funciones que se planean agregar a la ventana del controlador de pagos en la herramienta de seguimiento de errores de Chromium.

Próximos pasos

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