Enregistrer une application de paiement sur le Web

Découvrez comment configurer une application de paiement Web lors de l'enregistrement.

Les applications de paiement basées sur le Web sont des progressive web apps (PWA) et s'exécutent sur des workers de service. Le service worker d'une application de paiement joue un rôle important, car il capture les demandes de paiement d'un marchand, lance l'application de paiement et assure la médiation de la communication avec le marchand.

Pour configurer une application de paiement Web, vous devez enregistrer les modes de paiement disponibles et un service worker. Vous pouvez configurer votre application de paiement basée sur le Web de manière déclarative à l'aide d'un fichier manifeste d'application Web.

Prise en charge des navigateurs

Les paiements Web se composent de plusieurs technologies différentes, et l'état de prise en charge dépend du navigateur.

Chrome Safari Firefox
Ordinateur Android Ordinateur Mobile Ordinateur/Mobile
API Payment Request
API Payment Handler
Application de paiement iOS/Android ✔* ✔*

Configurer une application de paiement avec un fichier manifeste d'application Web

Pour configurer votre application de paiement basée sur le Web de manière déclarative, diffusez un fichier manifeste d'application Web.

Les propriétés suivantes du fichier manifeste de l'application Web sont pertinentes pour les applications de paiement sur le Web:

  • name
  • icons
  • serviceworker
    • src
    • scope
    • use_cache

Consultez Configurer un mode de paiement pour vous assurer que le fichier manifeste de votre mode de paiement pointe correctement vers le fichier manifeste de votre application Web.

Enregistrer un service worker juste-à-temps (JIT)

L'enregistrement JIT ne nécessite que la diffusion du fichier manifeste de l'application Web et aucun codage supplémentaire. Si vous avez déjà configuré le fichier manifeste de votre application Web et que vous le diffusez correctement, vous n'avez rien d'autre à faire. Le navigateur s'occupe du reste.

Déboguer une application de paiement Web

Lorsque vous développez l'interface utilisateur d'une application de paiement basée sur le Web, vous allez probablement passer du contexte du marchand au contexte de l'application de paiement. Les conseils de débogage suivants vous aideront à développer des applications dans Chrome.

Développer sur un serveur local

Quel serveur utilisez-vous pour le développement ? De nombreux développeurs ont tendance à utiliser localhost ou un environnement de serveur interne à l'entreprise, ce qui peut s'avérer difficile, car les fonctionnalités puissantes du navigateur ont tendance à nécessiter un environnement sécurisé (HTTPS) et un certificat valide. L'API Payment Request et l'API Payment Handler ne font pas exception, et les localhosts ou les serveurs internes à l'entreprise ne sont généralement pas fournis avec un certificat valide.

La bonne nouvelle est que certains navigateurs, y compris Chrome, exemptent les certificats pour http://localhost par défaut. Dans Chrome, vous pouvez également exempter l'exigence de certificat en lançant une instance Chrome. Par exemple, pour exempter l'exigence de http://*.corp.company.com, utilisez les options suivantes:

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

Pour en savoir plus sur l'exécution de Chrome avec un indicateur d'exécution, consultez Exécuter Chromium avec des indicateurs.

Transférer un port vers un serveur local

Vous pouvez transférer le serveur Web local vers un appareil Android à l'aide des outils pour les développeurs de Chrome et tester son fonctionnement à partir d'un navigateur mobile. Pour savoir comment procéder, consultez la section Accéder aux serveurs locaux.

Déboguer à distance un site Web sur Android Chrome à partir de DevTools pour ordinateur

Vous pouvez également déboguer Android Chrome dans les outils pour les développeurs pour ordinateur. Pour savoir comment procéder, consultez Premiers pas avec le débogage à distance des appareils Android.

Journalisation des événements du gestionnaire de paiement

DevTools peut afficher les événements de l'API Payment Handler pour faciliter le développement local. Ouvrez DevTools dans le contexte du marchand, puis accédez à la section "Payment Handler" (Gestionnaire de paiement) dans le volet Application. Cochez "Afficher les événements d'autres domaines", puis cliquez sur le bouton "Enregistrer" pour commencer à capturer les événements envoyés au service worker qui gère les paiements.

Capture d'écran de la journalisation des événements du gestionnaire de paiement.
Journalisation des événements du gestionnaire de paiement.

Étapes suivantes

L'étape suivante consiste à découvrir comment le service worker peut orchestrer une transaction de paiement au moment de l'exécution.