Skip to main content

Cómo integrar su aplicación de pago basada en web con Web Payments y proporcionar una mejor experiencia de usuario para los clientes.

Web Payments trae a la web una interfaz integrada del navegador que permite a los usuarios ingresar la información de pago requerida más fácil que nunca. Las API pueden invocar aplicaciones de pago basadas en web, así como aplicaciones de pago nativas.

Browser support

Web Payments consta de algunas tecnologías diferentes y el estado de soporte depende del navegador.

Chrome Safari Firefox
Desk Android ios Desk Mobile
Payment request API In active development
Payment Controller API In active development
Aplicación de pago nativa * ✔ ** ✔ **

* Chrome está considerando hacer que las aplicaciones de pago nativas estén disponibles en iOS.

** Safari is compatible with Apple Pay but not with third-party payment applications.

Benefits of web-based payment applications

Flujo de pago con una aplicación de pago basada en web.

  • Los pagos se realizan en modales, en el contexto del sitio web del comerciante, que proporciona una mejor experiencia de usuario que las técnicas típicas de aplicaciones de pago que utilizan redireccionamientos o ventanas emergentes.
  • The Web Payments APIs can be integrated into established websites, allowing you to take advantage of your existing user base.
  • A diferencia de las aplicaciones nativas, las aplicaciones de pago basadas en la web no necesitan instalarse con anticipación.

¿Cómo funciona una aplicación de pago basada en web?

Las aplicaciones de pago basadas en la web se crean utilizando las tecnologías web estándar. Cada aplicación de pago basada en la web debe incluir un trabajador de servicio.

A Service worker
es un script controlado por eventos que se ejecuta en segundo plano incluso si el sitio web de registro no está abierto en el navegador. Los trabajadores del servicio permiten que los sitios web trabajen sin conexión y envíen notificaciones automáticas, ya que pueden responder a las solicitudes con un caché que se almacena localmente con anticipación.

En una aplicación de pago basada en la web, un trabajador del servicio puede actuar como mediador para las solicitudes de pago al:

  • Abriendo una ventana modal y mostrando la interfaz de la aplicación de pago.
  • Puenteando la comunicación entre la aplicación de pago y el comerciante.
  • Obtener una autorización del cliente y pasar la credencial de pago al comerciante.

Aprenda cómo funciona una aplicación de pago en un comerciante en la vigencia de una transacción de pago.

Cómo los comerciantes descubren su aplicación de pago

Para que un comerciante use su aplicación de pago, debe usar la Payment request API y especifique el método de pago que admite utilizando el identificador del método de pago.

Si tiene un identificador de método de pago exclusivo para su aplicación de pago, puede configurar su propio manifiesto de método de pago y permitir que los navegadores descubran su aplicación.

Aprenda cómo funciona y cómo puede configurar un nuevo método de pago en Configuración de un método de pago.

API that you can use within the payment controller window

Una «ventana de gestión de pagos» es una ventana en la que se inician las aplicaciones de pago. En Chrome, dado que es una ventana normal del navegador Chrome, la mayoría de las API web deberían funcionar como si se usaran en un documento de nivel superior, con solo algunas excepciones:

  • El cambio de tamaño de la ventana gráfica está deshabilitado.
  • window.open () está desactivado.

WebAuthn support

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

Compatibilidad con la API de gestión de credenciales

La API de gestión de credenciales
proporciona una interfaz programática entre el sitio y el navegador para iniciar sesión sin problemas en todos los dispositivos. Puede permitir que los usuarios inicien sesión en su sitio web automáticamente según la información almacenada en el administrador de contraseñas del navegador. Está previsto que esté habilitado en Chrome, pero aún así Developing.

WebOTP support

La API de Web OTP le ayuda a obtener de forma programática una OTP a partir de un mensaje SMS y verificar un número de teléfono para el usuario más fácilmente. Está previsto que esté habilitado en Chrome, pero aún así Developing.

You can check the list of known issues and features that are planned to be added to the payment controller window at Chrome Bug Tracker.

Próximos pasos

Para comenzar a crear una aplicación de pago basada en la web, tiene tres partes distintas para implementar: