Payment Handler API 付款服務供應商 可以為付款服務供應商提供自訂付款服務 商家以及 Payment Request API。
本頁資訊僅適用於同時使用 CSP (Content-Security-Policy) 的網站 和 Payment Request API如果兩者都用不到,或兩者都不使用, 可以略過這些操作說明
如要確認付款服務供應商是否使用 Payment Handler API,請與對方聯絡 然後按照他們的指示操作。
如果針對以下項目使用 Payment Handler API 和 CSP (Content-Security-Policy),
因此您需要確保
瀏覽器會加入 CSP 標頭的 connect-src
指令。
舉例來說,如果您的 JavaScript 程式碼叫用 new
PaymentRequest([{supportedOrigins: ‘https://example.com/pay’}], details)
,則
您的 CSP「connect-src
」必須包含 https://example.com
或
https://example.com/pay
:
Content-Security-Policy: connect-src https://example.com/pay
如果 https://example.com/pay
是跨來源重新導向,目的地就會是目的地
來源也應該加入 CSP。舉例來說
https://example.com/pay
會重新導向至 https://pay.example.com
,之後皆是
來源必須包含在 CSP 中:
Content-Security-Policy: connect-src https://example.com/pay https://pay.example.com
在本機試用
如何在出貨前,先在本機上啟用功能:
- 使用 Chrome 前往
chrome://flags/#web-payment-api-csp
。 - 變更「CSP 的 Web Payment API 政策」從「預設」設為「已啟用」
- 重新啟動 Chrome。
檢查要求網址
如何查看透過 Payment Handler API 傳送的要求網址:
- 啟用
chrome://flags/#web-payment-api-csp
。 - 前往結帳頁面,然後開啟 Chrome 開發人員工具。
- 請找出類似下列的錯誤訊息:
text RangeError: Failed to construct 'PaymentRequest': https://example.com/pay payment method identifier violates Content Security Policy.
- 將指定方法 ID 新增至您的 CSP。
Eduardo Soares 提供的 Unsplash 相片