Webbasierte Zahlungs-App registrieren

Informationen zum Konfigurieren einer webbasierten Zahlungs-App während der Registrierung.

Eiji Kitamura

Webbasierte Zahlungs-Apps sind Progressive Web Apps (PWA) und werden auf Service-Workern ausgeführt. Der Service Worker in einer Zahlungs-App spielt eine wichtige Rolle, da er Zahlungsanforderungen von einem Händler erfasst, die Zahlungs-App startet und die Kommunikation mit dem Händler vermittelt.

Zum Konfigurieren einer webbasierten Zahlungs-App musst du die verfügbaren Zahlungsmethoden und einen Service Worker registrieren. Sie können Ihre webbasierte Zahlungs-App deklarativ mit einem Web-App-Manifest konfigurieren.

Unterstützte Browser

Web Payments besteht aus verschiedenen Technologien und der Supportstatus hängt vom Browser ab.

Chromium Safari Firefox
Computer Android Computer Mobilgeräte Computer/Mobilgeräte
Zahlungsanforderungs-API ✔ ✔ ✔ ✔
Zahlungs-Handler-API ✔ ✔
iOS-/Android-Zahlungs-App ✔ ✔ ✔* ✔*

Zahlungs-App mit einem Web-App-Manifest konfigurieren

Wenn du deine webbasierte Zahlungs-App deklarativ konfigurieren möchtest, musst du ein Web-App-Manifest bereitstellen.

Die folgenden Eigenschaften im Web-App-Manifest sind für webbasierte Zahlungs-Apps relevant:

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

Lies dir den Artikel Zahlungsmethode einrichten durch, um sicherzugehen, dass das Manifest deiner Zahlungsmethode korrekt auf das Manifest deiner Web-App verweist.

Service Worker JIT (Just-in-Time) registrieren

Für die JIT-Registrierung muss nur das Web-App-Manifest bereitgestellt werden. Eine zusätzliche Programmierung ist nicht erforderlich. Wenn Sie das Manifest Ihrer Web-App bereits konfiguriert haben und es korrekt bereitstellen, ist alles in Ordnung. Der Browser übernimmt den Rest.

Fehlerbehebung in einer webbasierten Zahlungsanwendung

Bei der Entwicklung eines Frontends für eine webbasierte Zahlungsanwendung werden Sie wahrscheinlich zwischen dem Kontext des Händlers und dem Kontext einer Zahlungsanwendung wechseln. Die folgenden Tipps zur Fehlerbehebung helfen Ihnen bei der Entwicklung von Chrome.

Auf einem lokalen Server entwickeln

Welchen Server verwenden Sie für die Entwicklung? Viele Entwickler verwenden den lokalen Host oder eine unternehmensinterne Serverumgebung. Dies kann eine Herausforderung darstellen, da leistungsstarke Browserfunktionen tendenziell eine sichere Umgebung (HTTPS) und ein gültiges Zertifikat erfordern. Die Payment Request API und die Payment Handler API sind keine Ausnahme und Localhosts oder unternehmensinterne Server haben normalerweise kein gültiges Zertifikat.

Die gute Nachricht ist, dass einige Browser, einschließlich Chrome, standardmäßig ausgenommene Zertifikate für http://localhost ausnehmen. In Chrome können Sie die Zertifikatsanforderung außerdem ausnehmen, indem Sie eine Chrome-Instanz starten. Wenn Sie beispielsweise die Anforderung von http://*.corp.company.com ausnehmen möchten, verwenden Sie die folgenden Flags:

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

Weitere Informationen zum Ausführen von Chrome mit einem Laufzeit-Flag finden Sie unter Chromium mit Flags ausführen.

Portweiterleitung eines lokalen Servers

Sie können den lokalen Webserver mithilfe der Entwicklertools von Chrome an ein Android-Gerät weiterleiten und testen, wie er in einem mobilen Browser funktioniert. Informationen dazu finden Sie unter Auf lokale Server zugreifen.

Remote-Debugging einer Website in Android Chrome über die Entwicklertools für Computer

Sie können auch mit den Entwicklertools von Android Chrome auf dem Computer Fehler beheben. Weitere Informationen dazu finden Sie unter Erste Schritte mit Remote-Debugging auf Android-Geräten.

Ereignisprotokollierung des Zahlungs-Handlers

Die Entwicklertools können Payment Handler API-Ereignisse anzeigen, um die lokale Entwicklung zu erleichtern. Öffne die Entwicklertools im Händlerkontext und gehe im Bereich Anwendung zum Abschnitt „Zahlungs-Handler“. Klicken Sie auf das Kästchen „Ereignisse aus anderen Domains anzeigen“ und dann auf die Schaltfläche „Aufzeichnen“, um Ereignisse zu erfassen, die an den Service Worker gesendet werden, der die Zahlungen verarbeitet.

Screenshot der Ereignisprotokollierung des Payment Handler.
Ereignisprotokollierung des Zahlungs-Handlers.

Nächste Schritte

Im nächsten Schritt erfahren Sie, wie der Service Worker eine Zahlungstransaktion zur Laufzeit orchestrieren kann.