API Payment Handler permet aux fournisseurs de services de paiement de proposer leur expérience de paiement personnalisée marchands, ainsi que l'API Payment Request.
Les informations figurant sur cette page ne s'appliquent qu'aux sites Web qui utilisent à la fois CSP (Content-Security-Policy). et l'API Payment Request. Si vous n'utilisez aucun des deux ou un seul, vous pouvez ignorer ces instructions.
Pour vérifier si votre fournisseur de services de paiement utilise l'API Payment Handler, contactez-le et suivez leurs instructions.
Si vous utilisez l'API Payment Handler et CSP (Content-Security-Policy) pour
une meilleure protection, vous devez vous assurer que les domaines des requêtes HTTP envoyées depuis
le navigateur sont ajoutés à la directive connect-src de l'en-tête CSP.
Par exemple, si votre code JavaScript appelle new
PaymentRequest([{supportedOrigins: ‘https://example.com/pay’}], details), alors
votre CSP connect-src doit inclure https://example.com ou
https://example.com/pay:
Content-Security-Policy: connect-src https://example.com/pay
Si https://example.com/pay est une redirection multi-origines, la destination
doit également être inclus dans la CSP. Par exemple, si
https://example.com/pay redirige vers https://pay.example.com, puis les deux
les origines doivent être incluses dans la CSP:
Content-Security-Policy: connect-src https://example.com/pay https://pay.example.com
Essayer en local
Pour activer la fonctionnalité localement avant de l'envoyer:
- Accédez à
chrome://flags/#web-payment-api-cspsur Chrome. - Modification de "Règle CSP pour l'API Web Payment" de "Par défaut" sur "Activé".
- Redémarrez Chrome.
Vérifier les URL des requêtes
Pour vérifier les URL des requêtes envoyées depuis l'API Payment Handler:
- Activez
chrome://flags/#web-payment-api-csp. - Accédez à votre page de paiement et ouvrez les outils pour les développeurs Chrome.
- Recherchez les messages d'erreur suivants:
text RangeError: Failed to construct 'PaymentRequest': https://example.com/pay payment method identifier violates Content Security Policy. - Ajoutez l'identifiant de méthode spécifié à votre CSP.
Photo par Eduardo Soares sur Unsplash