Payment Handler API מאפשר לספקים של שירותי תשלומים להציע לחנויות חוויית תשלום מותאמת אישית, יחד עם Payment Request API.
המידע בדף הזה רלוונטי רק לאתרים שמשתמשים גם ב-CSP (Content-Security-Policy) וגם ב-Payment Request API. אם אתם לא משתמשים באף אחת מהן או רק באחת מהן, תוכלו לדלג על ההוראות האלה.
כדי לבדוק אם ספק התשלומים שלכם משתמש ב-Payment Handler API, פנו אליו ופעלו לפי ההוראות שלו.
אם אתם משתמשים ב-Payment Handler API וב-CSP (Content-Security-Policy) להגנה טובה יותר, עליכם לוודא שהדומיינים של בקשות ה-HTTP שנשלחות מהדפדפן מתווספים להוראה connect-src בכותרת ה-CSP.
לדוגמה, אם קוד ה-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://flags/#web-payment-api-cspב-Chrome. - משנים את האפשרות 'מדיניות CSP ל-Web Payment API' מ-Default (ברירת מחדל) ל-Enabled (מופעל).
- מפעילים מחדש את Chrome.
בדיקת כתובות ה-URL של הבקשות
כדי לבדוק את כתובות ה-URL של הבקשות שנשלחות מ-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. - מוסיפים את מזהה השיטה שצוין ל-CSP.
תמונה של Eduardo Soares ב-Unsplash