PaymentAppPractice (original) (raw)
Icons and Labels
- @@size guidance?
Allow users to view the certificate chain
- When displaying a Web-based payment app window, use existing browser UI patterns that enable the user to view the certificate chain.
Publishing two "wallets" from the same Origin
At times, a provider publishing payment handlers may wish to group instruments with greater flexibility and granularity than having them all listed together under a single origin. These use cases include:
- White label wallets - one provider provides wallet services for multiple vendors
- Multiple user profiles with a single provider (e.g., business wallet vs personal wallet)
- Multiple instruments held with a single provider
If your payment handler needs to compartmentalize the payment instruments into two wallets, one of the simplest approaches is to use two separate service workers with differentscopesor paths. Here's the list of files to enable this solution for the personal/business split of the payment instruments in the fictional product named Bob Pay. A visitor to /personal and /business paths on your website will be able to install two service workers with different responsibilities.
Files in /personal/ subdirectory:
/personal/manifest.json
{ "scope": "/personal/", "name": "Bob Pay Personal", "icons": [{ "src": "/img/personal.png" }] }
/personal/index.html
Bob Pay Personal Wallet
Install Bob Pay Personal Wallet
You can switch to manage Bob Pay Business Wallet.
/personal/payment-handler.js
self.addEventListener('paymentrequest', function(e) { console.log('Not implemented.'); e.respondWith(undefined); });
Files in /business/ subdirectory:
/business/manifest.json
{ "scope": "/business/", "name": "Bob Pay Business", "icons": [{ "src": "/img/business.png" }] }
/business/index.html
Bob Pay Business Wallet
Install Bob Pay Business Wallet
You can switch to manage Bob Pay Personal Wallet.
/business/payment-handler.js
self.addEventListener('paymentrequest', function(e) { console.log('Not implemented.'); e.respondWith(undefined); });