การลงทะเบียนแอปการชำระเงินบนเว็บ

ดูวิธีกำหนดค่าแอปสำหรับการชำระเงินบนเว็บระหว่างการลงทะเบียน

Eiji Kitamura

แอปการชำระเงินบนเว็บคือ Progressive Web App (PWA) และทำงานที่ด้านบนของบริการ ผู้ปฏิบัติงาน Service Worker ในแอปการชำระเงินมีบทบาทสำคัญเพราะโปรแกรมรับชำระเงิน คำขอจากผู้ขาย เปิดแอปการชำระเงิน และเป็นสื่อกลาง การสื่อสารกับผู้ขาย

หากต้องการกำหนดค่าแอปการชำระเงินบนเว็บ คุณต้องลงทะเบียนการชำระเงินที่พร้อมใช้งาน และ Service Worker คุณสามารถกำหนดค่าแอปการชำระเงินบนเว็บ อย่างชัดเจนด้วยไฟล์ Manifest ของเว็บแอป

การสนับสนุนเบราว์เซอร์

Web Payments ประกอบด้วยเทคโนโลยี 2-3 รูปแบบและการสนับสนุน สถานะ ขึ้นอยู่กับเบราว์เซอร์

Chromium Safari Firefox
เดสก์ท็อป Android เดสก์ท็อป อุปกรณ์เคลื่อนที่ เดสก์ท็อป/อุปกรณ์เคลื่อนที่
API คำขอการชำระเงิน ✔ ✔ ✔ ✔
API เครื่องจัดการการชำระเงิน ✔ ✔
แอปชำระเงินบน iOS/Android ✔ ✔ ✔* ✔*

การกำหนดค่าแอปการชำระเงินด้วยไฟล์ Manifest ของเว็บแอป

หากต้องการกำหนดค่าแอปการชำระเงินบนเว็บตามประกาศ ให้แสดงเว็บแอป ไฟล์ Manifest

พร็อพเพอร์ตี้ต่อไปนี้ในไฟล์ Manifest ของเว็บแอปเกี่ยวข้องกับแอปการชำระเงินบนเว็บ

  • name
  • icons
  • serviceworker
    • src
    • scope
    • use_cache

โปรดดูการตั้งค่าการชำระเงิน วิธีการ เพื่อให้มั่นใจว่าไฟล์ Manifest ของวิธีการชำระเงินชี้ไปที่ไฟล์ Manifest ของเว็บแอป อย่างเหมาะสม

การลงทะเบียน Service Worker แบบทันที (JIT)

การลงทะเบียน JIT กำหนดให้แสดงเว็บแอปเท่านั้น ไฟล์ Manifest และไม่ต้องเขียนโค้ดเพิ่มเติม หากคุณกำหนดค่าไฟล์ Manifest ของเว็บแอปแล้ว และ กำลังแสดงอย่างถูกต้อง คุณควรพร้อมใช้งาน เบราว์เซอร์จะจัดการ พักผ่อน

การแก้ไขข้อบกพร่องของแอปการชำระเงินบนเว็บ

เมื่อพัฒนาฟรอนท์เอนด์ของแอปการชำระเงินบนเว็บ คุณอาจต้อง บริบทผู้ขายและแอปการชำระเงิน เคล็ดลับการแก้ไขข้อบกพร่องต่อไปนี้จะช่วย ประสบการณ์ในการพัฒนาของคุณบน Chrome

การพัฒนาบนเซิร์ฟเวอร์ภายใน

คุณใช้เซิร์ฟเวอร์ใดในการพัฒนา นักพัฒนาซอฟต์แวร์จำนวนมากมักใช้ localhost หรือสภาพแวดล้อมเซิร์ฟเวอร์ภายในบริษัท ซึ่งอาจทำได้ยากเพราะ คุณลักษณะที่มีประสิทธิภาพในเบราว์เซอร์มีแนวโน้มที่จะต้องการสภาพแวดล้อมที่ปลอดภัย (HTTPS) และใบรับรองที่ใช้งานได้ Payment Request API และ Payment Handler API ไม่มีข้อยกเว้น และ localhost หรือเซิร์ฟเวอร์ภายในบริษัทมักจะไม่มี ใบรับรองที่ใช้งานได้

ข่าวดีคือบางเบราว์เซอร์ รวมถึง Chrome ได้รับการยกเว้นใบรับรองสำหรับ http://localhost โดยค่าเริ่มต้น นอกจากนี้ คุณยังยกเว้นใบรับรองใน Chrome ได้ด้วย ด้วยการเปิดใช้งานอินสแตนซ์ Chrome ตัวอย่างเช่น หากต้องการยกเว้น ข้อกำหนดจาก http://*.corp.company.com ให้ใช้ค่าสถานะต่อไปนี้

macOS

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --ignore-certificate-errors --unsafely-treat-insecure-origin-as-secure=http://*.corp.company.com

หน้าต่าง

chrome.exe --ignore-certificate-errors --unsafely-treat-insecure-origin-as-secure=http://*.corp.company.com

ดูข้อมูลเพิ่มเติมเกี่ยวกับการเรียกใช้ Chrome ด้วยแฟล็กรันไทม์ที่หัวข้อเรียกใช้ Chromium ด้วย แฟล็ก

การส่งต่อพอร์ตเซิร์ฟเวอร์ภายใน

คุณสามารถโอนเว็บเซิร์ฟเวอร์ในเครื่องไปยังอุปกรณ์ Android ได้โดยใช้ เครื่องมือสำหรับนักพัฒนาเว็บและทดสอบวิธีการทำงานจากเบราว์เซอร์บนอุปกรณ์เคลื่อนที่ ดูวิธีการได้ที่ ดูการเข้าถึงในพื้นที่ เซิร์ฟเวอร์

การแก้ไขข้อบกพร่องของเว็บไซต์จากระยะไกลใน Chrome บน Android จากเครื่องมือสำหรับนักพัฒนาเว็บบนเดสก์ท็อป

คุณยังแก้ไขข้อบกพร่องของ Android Chrome ในเครื่องมือสำหรับนักพัฒนาเว็บบนเดสก์ท็อปได้อีกด้วย ดูวิธีการได้ที่ ดูเริ่มต้นใช้งานการแก้ไขข้อบกพร่องระยะไกลใน Android อุปกรณ์

การบันทึกเหตุการณ์ของเครื่องจัดการการชำระเงิน

เครื่องมือสำหรับนักพัฒนาเว็บแสดง Payment Handler API ได้ กิจกรรม สำหรับ ในพื้นที่ที่ง่ายขึ้น เปิดเครื่องมือสำหรับนักพัฒนาเว็บในบริบทของผู้ขายและไปที่ "เครื่องจัดการการชำระเงิน" ในแผงแอปพลิเคชัน เลือก "แสดงกิจกรรม" จากโดเมนอื่น" และคลิก "บันทึก" ปุ่มเพื่อเริ่มบันทึกเหตุการณ์ที่ส่ง ไปยัง Service Worker ที่จัดการการชำระเงิน

วันที่ ภาพหน้าจอของการบันทึกเหตุการณ์ของเครื่องจัดการการชำระเงิน
การบันทึกเหตุการณ์ของเครื่องจัดการการชำระเงิน

ขั้นตอนถัดไป

ขั้นตอนถัดไปคือการดูวิธีที่โปรแกรมทำงานของบริการสามารถจัดการการชำระเงินเป็นกลุ่ม ธุรกรรมในช่วงรันไทม์