Registrazione di un'app per pagamenti basata sul web

Scopri come configurare un'app di pagamento basata sul web durante la registrazione.

Eiji Kitamura

Le app di pagamento basate sul web sono app web progressive (PWA) e vengono eseguite in base ai lavoratori di servizio. Il worker di servizio in un'app di pagamento svolge un ruolo importante in quanto acquisisce le richieste di pagamento da un commerciante, avvia l'app di pagamento e media la comunicazione con il commerciante.

Per configurare un'app di pagamento basata sul web, devi registrare i metodi di pagamento disponibili e un service worker. Puoi configurare la tua app di pagamento basata su web in modo dichiarativo con un manifest dell'app web.

Supporto browser

I pagamenti web sono costituiti da diverse tecnologie e lo stato del supporto dipende dal browser.

Cromo Safari Firefox
Desktop Android Desktop Dispositivi mobili Computer/dispositivo mobile
API Payment Request ✔ ✔ ✔ ✔
API Payment Handler ✔ ✔
App di pagamento per iOS/Android ✔ ✔ ✔* ✔*

Configurazione di un'app di pagamento con un manifest dell'app web

Per configurare in modo dichiarativo la tua app di pagamento basata sul web, pubblica un file manifest dell'app web.

Le seguenti proprietà nel manifest dell'app web sono pertinenti per le app di pagamento basate sul web:

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

Consulta la sezione Configurare un metodo di pagamento per assicurarti che il manifest del metodo di pagamento indichi correttamente il manifest dell'app web.

Registrazione di un service worker just-in-time (JIT)

La registrazione JIT richiede solo la pubblicazione del manifest dell'app web e nessuna programmazione aggiuntiva. Se hai già configurato il manifest dell'app web e lo stai pubblicando correttamente, non dovresti avere problemi. Il browser gestirà il resto.

Eseguire il debug di un'app di pagamento basata sul web

Quando sviluppi un frontend dell'app di pagamento basato sul web, probabilmente passerai dal contesto del commerciante al contesto dell'app di pagamento. I seguenti suggerimenti di debug ti aiuteranno a sviluppare esperienza di sviluppo su Chrome.

Sviluppo su un server locale

Quale server utilizzi per lo sviluppo? Molti sviluppatori tendono a utilizzare localhost o un ambiente di server interno all'azienda, il che può essere complicato perché le funzionalità avanzate del browser tendono a richiedere un ambiente sicuro (HTTPS) e un certificato valido. L'API Payment Request e l'API Payment Handler non fanno eccezione e in genere i server localhost o interni all'azienda non sono dotati di un certificato valido.

La buona notizia è che alcuni browser, tra cui Chrome, esentano i certificati per http://localhost per impostazione predefinita. Anche in Chrome, puoi esentare il requisito del certificato avviando un'istanza di Chrome. Ad esempio, per esentare il requisito da http://*.corp.company.com, utilizza i seguenti flag:

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

Scopri di più sull'esecuzione di Chrome con un flag di runtime in Eseguire Chromium con parametri facoltativi.

Inoltro di porte a un server locale

Puoi inoltrare la porta del server web locale a un dispositivo Android utilizzando gli Strumenti per sviluppatori di Chrome e testarne il funzionamento da un browser mobile. Per scoprire come fare, consulta Accedere ai server locali.

Debug remoto di un sito web su Chrome per Android da DevTools per il desktop

Puoi anche eseguire il debug di Chrome per Android in DevTools per computer. Per scoprire come, consulta Iniziare a utilizzare il debug remoto dei dispositivi Android.

Registrazione degli eventi relativi al gestore dei pagamenti

DevTools può visualizzare gli eventi dell'API Payment Handler per semplificare lo sviluppo locale. Apri DevTools nel contesto del commerciante e vai alla sezione "Gestore dei pagamenti" nel riquadro Applicazione. Seleziona "Mostra eventi di altri domini" e fai clic sul pulsante "Registra" per iniziare a acquisire gli eventi inviati al service worker che gestisce i pagamenti.

Uno screenshot della registrazione degli eventi del gestore dei pagamenti.
Logging degli eventi del gestore dei pagamenti.

Passaggi successivi

Il passaggio successivo consiste nell'apprendere come il service worker può orchestrare una transazione di pagamento in fase di esecuzione.