Obtén más información para configurar una app de pagos basada en la Web durante el registro.
Las apps de pago basadas en la Web son apps web progresivas (AWP) y se ejecutan sobre service workers. El service worker de una app de pagos desempeña un papel importante, ya que captura las solicitudes de pago de un comercio, inicia la app de pagos y media la comunicación con el comercio.
Para configurar una app de pagos basada en la Web, debes registrar las formas de pago disponibles y un trabajador de servicio. Puedes configurar tu app de pagos basada en la Web de forma declarativa con un manifiesto de la app web.
Navegadores compatibles
Los pagos en la Web constan de varias tecnologías diferentes, y el estado de compatibilidad depende del navegador.
Cómo configurar una app de pagos con un manifiesto de app web
Para configurar tu app de pagos basada en la Web de forma declarativa, publica un manifiesto de la app web.
Las siguientes propiedades del manifiesto de la app web son relevantes para las apps de pago basadas en la Web:
nameiconsserviceworkersrcscopeuse_cache
Consulta Cómo configurar una forma de pago para asegurarte de que el manifiesto de tu forma de pago apunte correctamente al manifiesto de tu app web.
Cómo registrar un service worker justo a tiempo (JIT)
El registro JIT solo requiere que se publique el manifiesto de la app web y no requiere codificación adicional. Si ya configuraste el manifiesto de tu app web y lo publicas correctamente, no deberías tener problemas. El navegador se encargará del resto.
Cómo depurar una app de pagos basada en la Web
Cuando desarrolles un frontend de una app de pagos basada en la Web, es probable que cambies entre el contexto del comercio y el de la app de pagos. Las siguientes sugerencias de depuración te ayudarán con tu experiencia de desarrollo en Chrome.
Desarrollo en un servidor local
¿Qué servidor usas para el desarrollo? Muchos desarrolladores suelen usar localhost o un entorno de servidor interno de la empresa, lo que puede ser un desafío, ya que las funciones potentes del navegador suelen requerir un entorno seguro (HTTPS) y un certificado válido. La API de Payment Request y la API de Payment Handler basada en la Web no son una excepción, y los servidores internos de la empresa o los localhost no suelen tener un certificado válido.
La buena noticia es que algunos navegadores, incluido Chrome, eximen los certificados de http://localhost de forma predeterminada. También en Chrome, puedes eximir el requisito del certificado iniciando una instancia de Chrome. Por ejemplo, para eximir el requisito de http://*.corp.company.com, usa las siguientes marcas:
macOS
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --ignore-certificate-errors --unsafely-treat-insecure-origin-as-secure=http://*.corp.company.com
Windows
chrome.exe --ignore-certificate-errors --unsafely-treat-insecure-origin-as-secure=http://*.corp.company.com
Obtén más información para ejecutar Chrome con una marca de tiempo de ejecución en Ejecuta Chromium con marcas.
Reenvío de puertos de un servidor local
Puedes redireccionar el servidor web local a un dispositivo Android con las Herramientas para desarrolladores de Chrome y probar cómo funciona desde un navegador para dispositivos móviles. Para obtener más información, consulta Cómo acceder a servidores locales.
Depuración remota de un sitio web en Chrome para Android desde DevTools para computadoras
También puedes depurar Chrome para Android en las Herramientas para desarrolladores de escritorio. Para obtener más información, consulta Cómo comenzar a usar los dispositivos Android de depuración remota.
Registro de eventos del controlador de pagos
Las Herramientas para desarrolladores pueden mostrar eventos de la API de Payment Handler basada en la Web para facilitar el desarrollo local. Abre DevTools en el contexto del comercio y ve a la sección "Payment Handler" en el panel Application. Marca la casilla "Mostrar eventos de otros dominios" y haz clic en el botón "Registrar" para comenzar a capturar los eventos enviados al trabajador de servicio que controla los pagos.
Próximos pasos
El siguiente paso es aprender cómo el trabajador de servicio puede organizar una transacción de pago en el tiempo de ejecución.