ה-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),
connect-src של ה-CSP חייב לכלול את 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' מ"ברירת מחדל" למצב 'מופעל'.
- מפעילים מחדש את 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 ב-Un ממליצים