เรียนรู้วิธีปรับเปลี่ยนแอปการชำระเงินบน Android ของคุณเพื่อให้ทำงานร่วมกับระบบชำระเงินบนเว็บ และมอบประสบการณ์ของผู้ใช้ที่ดียิ่งขึ้นให้กับลูกค้า
Payment Request API ได้นำอินเทอร์เฟซภายในเบราว์เซอร์มาไว้ในเว็บซึ่งช่วยให้ผู้ใช้ป้อนข้อมูลการชำระเงินที่จำเป็นได้ง่ายกว่าที่เคย API ยังเรียกใช้แอปการชำระเงินเฉพาะแพลตฟอร์มได้ด้วย
เมื่อเปรียบเทียบกับการใช้เพียง Android Intent แล้ว ระบบชำระเงินบนเว็บช่วยให้ผสานรวมกับเบราว์เซอร์ ความปลอดภัย และประสบการณ์ของผู้ใช้ได้ดียิ่งขึ้น
- แอปการชำระเงินเปิดตัวเป็นโมดัลในบริบทของเว็บไซต์ผู้ขาย
- การใช้งานจะเป็นส่วนเสริมสำหรับแอปการชำระเงินที่มีอยู่แล้ว ช่วยให้คุณใช้ประโยชน์จากฐานผู้ใช้ได้
- ระบบจะตรวจสอบลายเซ็นของแอปการชำระเงินเพื่อป้องกันการโหลดจากแหล่งที่ไม่รู้จัก
- แอปการชำระเงินรองรับวิธีการชำระเงินได้หลายวิธี
- คุณผสานรวมวิธีการชำระเงินใดก็ได้ เช่น คริปโตเคอเรนซี การโอนเงินผ่านธนาคาร และอื่นๆ แอปสำหรับการชำระเงินในอุปกรณ์ Android ยังผสานรวมวิธีการที่ต้องการการเข้าถึงชิปฮาร์ดแวร์ในอุปกรณ์ได้ด้วย
การใช้การชำระเงินบนเว็บในแอปการชำระเงิน Android มี 4 ขั้นตอนดังนี้
- ช่วยให้ผู้ขายค้นพบแอปการชำระเงินของคุณ
- แจ้งให้ผู้ขายทราบหากลูกค้ามีเครื่องมือที่ลงทะเบียนแล้ว (เช่น บัตรเครดิต) ซึ่งพร้อมชำระเงิน
- ให้ลูกค้าชำระเงิน
- ตรวจสอบใบรับรองที่ลงนามของผู้โทร
หากต้องการดูการทำงานของการชำระเงินบนเว็บ โปรดดูการสาธิต android-web-payment
ขั้นตอนที่ 1: ช่วยให้ผู้ขายค้นพบแอปการชำระเงินของคุณ
ผู้ขายต้องใช้ Payment Request API และระบุวิธีการชำระเงินที่คุณรองรับโดยใช้ตัวระบุวิธีการชำระเงิน จึงจะใช้แอปการชำระเงินได้
หากมีตัวระบุวิธีการชำระเงินที่ไม่ซ้ำกันสำหรับแอปการชำระเงิน คุณสามารถตั้งค่าไฟล์ Manifest วิธีการชำระเงินของคุณเองเพื่อให้เบราว์เซอร์ค้นพบแอปของคุณ
ขั้นตอนที่ 2: แจ้งให้ผู้ขายทราบหากลูกค้ามีเครื่องมือที่ลงทะเบียนไว้พร้อมชำระเงิน
ผู้ขายสามารถโทรไปที่ hasEnrolledInstrument()
เพื่อสอบถามว่าลูกค้าชำระเงินได้หรือไม่ คุณสามารถใช้ IS_READY_TO_PAY
เป็นบริการ Android เพื่อตอบคำถามนี้ได้
AndroidManifest.xml
ประกาศบริการของคุณด้วยตัวกรอง Intent ที่มีการดำเนินการ org.chromium.intent.action.IS_READY_TO_PAY
<service
android:name=".SampleIsReadyToPayService"
android:exported="true">
<intent-filter>
<action android:name="org.chromium.intent.action.IS_READY_TO_PAY" />
</intent-filter>
</service>
บริการ IS_READY_TO_PAY
เป็นตัวเลือกที่ไม่บังคับ หากไม่มีเครื่องจัดการ Intent ดังกล่าวในแอปการชำระเงิน เว็บเบราว์เซอร์จะถือว่าแอปชำระเงินได้เสมอ
AIDL
API สำหรับบริการ IS_READY_TO_PAY
กำหนดไว้ใน AIDL สร้างไฟล์ AIDL 2 ไฟล์ที่มีเนื้อหาต่อไปนี้
app/src/main/aidl/org/chromium/IsReadyToPayServiceCallback.aidl
package org.chromium;
interface IsReadyToPayServiceCallback {
oneway void handleIsReadyToPay(boolean isReadyToPay);
}
app/src/main/aidl/org/chromium/IsReadyToPayService.aidl
package org.chromium;
import org.chromium.IsReadyToPayServiceCallback;
interface IsReadyToPayService {
oneway void isReadyToPay(IsReadyToPayServiceCallback callback);
}
การใช้ IsReadyToPayService
ตัวอย่างการใช้งาน IsReadyToPayService
ที่ง่ายที่สุดมีดังนี้
class SampleIsReadyToPayService : Service() {
private val binder = object : IsReadyToPayService.Stub() {
override fun isReadyToPay(callback: IsReadyToPayServiceCallback?) {
callback?.handleIsReadyToPay(true)
}
}
override fun onBind(intent: Intent?): IBinder? {
return binder
}
}
คำตอบ
บริการสามารถส่งการตอบกลับผ่านเมธอด handleIsReadyToPay(Boolean)
callback?.handleIsReadyToPay(true)
สิทธิ์
คุณสามารถใช้ Binder.getCallingUid()
เพื่อตรวจสอบว่าผู้โทรคือใคร โปรดทราบว่าคุณต้องดำเนินการนี้ในเมธอด isReadyToPay
ไม่ใช่ในเมธอด onBind
override fun isReadyToPay(callback: IsReadyToPayServiceCallback?) {
try {
val callingPackage = packageManager.getNameForUid(Binder.getCallingUid())
// …
โปรดดูวิธียืนยันใบรับรองการลงชื่อของผู้โทรเกี่ยวกับวิธียืนยันว่าแพ็กเกจการโทรมีลายเซ็นที่ถูกต้อง
ขั้นตอนที่ 3: ให้ลูกค้าชำระเงิน
ผู้ขายจะโทรหา show()
ให้เปิดแอปการชำระเงินเพื่อให้ลูกค้าชำระเงินได้ มีการเรียกใช้แอปการชำระเงินผ่านความตั้งใจของ Android PAY
ที่มีข้อมูลธุรกรรมในพารามิเตอร์ Intent
แอปการชำระเงินตอบกลับด้วย methodName
และ details
ซึ่งเป็นแอปการชำระเงินเฉพาะและไม่ชัดเจนสำหรับเบราว์เซอร์ เบราว์เซอร์จะแปลงสตริง details
เป็นออบเจ็กต์ JavaScript สำหรับผู้ขายผ่านการดีซีเรียลไลซ์ JSON แต่ไม่บังคับใช้ความถูกต้องใดๆ นอกเหนือจากนั้น เบราว์เซอร์จะไม่แก้ไข details
ระบบจะส่งค่าพารามิเตอร์ดังกล่าวไปยังผู้ขายโดยตรง
AndroidManifest.xml
กิจกรรมที่มีตัวกรอง Intent PAY
ควรมีแท็ก <meta-data>
ที่ระบุตัวระบุวิธีการชำระเงินเริ่มต้นสำหรับแอป
หากต้องการรองรับวิธีการชำระเงินหลายวิธี ให้เพิ่มแท็ก <meta-data>
ที่มีแหล่งข้อมูล <string-array>
<activity
android:name=".PaymentActivity"
android:theme="@style/Theme.SamplePay.Dialog">
<intent-filter>
<action android:name="org.chromium.intent.action.PAY" />
</intent-filter>
<meta-data
android:name="org.chromium.default_payment_method_name"
android:value="https://bobbucks.dev/pay" />
<meta-data
android:name="org.chromium.payment_method_names"
android:resource="@array/method_names" />
</activity>
resource
ต้องเป็นรายการสตริง ซึ่งแต่ละรายการต้องเป็น URL ที่สมบูรณ์และใช้งานได้โดยมีรูปแบบ HTTPS ดังที่แสดงที่นี่
<?xml version="1.0" encoding="utf-8"?>
<resources>
<string-array name="method_names">
<item>https://alicepay.com/put/optional/path/here</item>
<item>https://charliepay.com/put/optional/path/here</item>
</string-array>
</resources>
พารามิเตอร์
ระบบจะส่งพารามิเตอร์ต่อไปนี้ไปยังกิจกรรมเป็นรายการเพิ่มเติมของ Intent
methodNames
methodData
topLevelOrigin
topLevelCertificateChain
paymentRequestOrigin
total
modifiers
paymentRequestId
val extras: Bundle? = intent?.extras
methodNames
ชื่อของวิธีที่ใช้ องค์ประกอบต่างๆ คือคีย์ในพจนานุกรม methodData
ซึ่งเป็นวิธีการที่แอปการชำระเงินรองรับ
val methodNames: List<String>? = extras.getStringArrayList("methodNames")
methodData
การแมปจาก methodNames
แต่ละรายการไปยัง methodData
val methodData: Bundle? = extras.getBundle("methodData")
merchantName
เนื้อหาของแท็ก HTML <title>
ของหน้าชำระเงินของผู้ขาย (บริบทการท่องเว็บระดับบนสุดของเบราว์เซอร์)
val merchantName: String? = extras.getString("merchantName")
topLevelOrigin
ต้นทางของผู้ขายที่ไม่มีรูปแบบ (ต้นทางแบบไม่มีรูปแบบของบริบทการท่องเว็บระดับบนสุด) ตัวอย่างเช่น https://mystore.com/checkout
ถูกส่งผ่าน
เป็น mystore.com
val topLevelOrigin: String? = extras.getString("topLevelOrigin")
topLevelCertificateChain
กลุ่มใบรับรองของผู้ขาย (กลุ่มใบรับรองของบริบทการเรียกดูระดับบนสุด) ไม่มีค่าสำหรับ localhost และไฟล์ในดิสก์ ซึ่งเป็นบริบทที่ปลอดภัยซึ่งไม่มีใบรับรอง SSL Parcelable
แต่ละรายการคือแพ็กเกจที่มีคีย์ certificate
และค่าอาร์เรย์ไบต์
val topLevelCertificateChain: Array<Parcelable>? =
extras.getParcelableArray("topLevelCertificateChain")
val list: List<ByteArray>? = topLevelCertificateChain?.mapNotNull { p ->
(p as Bundle).getByteArray("certificate")
}
paymentRequestOrigin
ต้นทางที่ไม่มีรูปแบบของบริบทการท่องเว็บ iframe ซึ่งเรียกใช้ตัวสร้าง new
PaymentRequest(methodData, details, options)
ใน JavaScript หากมีการเรียกตัวสร้างจากบริบทระดับบนสุด ค่าของพารามิเตอร์นี้จะเท่ากับค่าของพารามิเตอร์ topLevelOrigin
val paymentRequestOrigin: String? = extras.getString("paymentRequestOrigin")
total
สตริง JSON ที่แสดงจำนวนเงินรวมของธุรกรรม
val total: String? = extras.getString("total")
เนื้อหาตัวอย่างของสตริงมีดังนี้
{"currency":"USD","value":"25.00"}
modifiers
เอาต์พุตของ JSON.stringify(details.modifiers)
โดยที่ details.modifiers
มีเฉพาะ supportedMethods
และ total
paymentRequestId
ช่อง PaymentRequest.id
ที่แอป "การชำระเงินแบบพุช" ควรเชื่อมโยงกับสถานะธุรกรรม เว็บไซต์ผู้ขายจะใช้ช่องนี้ในการค้นหาแอป
"การชำระเงินแบบพุช" เพื่อดูสถานะของธุรกรรมนอกช่วง
val paymentRequestId: String? = extras.getString("paymentRequestId")
คำตอบ
กิจกรรมจะส่งการตอบกลับผ่าน setResult
ด้วย RESULT_OK
ได้
setResult(Activity.RESULT_OK, Intent().apply {
putExtra("methodName", "https://bobbucks.dev/pay")
putExtra("details", "{\"token\": \"put-some-data-here\"}")
})
finish()
คุณต้องระบุพารามิเตอร์ 2 รายการเป็น Intent เพิ่มเติม ดังนี้
methodName
: ชื่อของเมธอดที่ใช้details
: สตริง JSON ที่มีข้อมูลที่จำเป็นสำหรับผู้ขายในการทำธุรกรรมให้เสร็จสมบูรณ์ หากความสำเร็จคือtrue
ก็จะต้องสร้างdetails
ในลักษณะที่JSON.parse(details)
จะประสบความสำเร็จ
คุณสามารถส่ง RESULT_CANCELED
ได้หากทำธุรกรรมในแอปการชำระเงินไม่เสร็จสมบูรณ์ เช่น หากผู้ใช้พิมพ์รหัส PIN สำหรับบัญชีในแอปการชำระเงินไม่สำเร็จ เบราว์เซอร์อาจให้ผู้ใช้เลือกแอปการชำระเงินอื่น
setResult(RESULT_CANCELED)
finish()
หากผลของกิจกรรมการตอบสนองการชำระเงินที่ได้รับจากแอปการชำระเงินที่เรียกใช้มีการตั้งค่าเป็น RESULT_OK
แล้ว Chrome จะตรวจหา methodName
และ details
ที่ไม่ว่างเปล่าในรายการเพิ่มเติม หากตรวจสอบไม่สำเร็จ Chrome จะส่งคืนคำสัญญาที่ถูกปฏิเสธจาก request.show()
พร้อมข้อความแสดงข้อผิดพลาดอย่างใดอย่างหนึ่งต่อไปนี้ของนักพัฒนาแอป
'Payment app returned invalid response. Missing field "details".'
'Payment app returned invalid response. Missing field "methodName".'
สิทธิ์
กิจกรรมจะตรวจสอบผู้โทรได้โดยใช้วิธีการ getCallingPackage()
val caller: String? = callingPackage
ขั้นตอนสุดท้ายคือการตรวจสอบใบรับรองการลงชื่อของผู้โทรเพื่อยืนยันว่าแพ็กเกจการโทรมีลายเซ็นที่ถูกต้อง
ขั้นตอนที่ 4: ยืนยันใบรับรองที่ลงนามของผู้โทร
คุณสามารถตรวจสอบชื่อแพ็กเกจของผู้โทรด้วย Binder.getCallingUid()
ใน IS_READY_TO_PAY
และ Activity.getCallingPackage()
ใน PAY
ในการยืนยันว่าผู้โทรเป็นเบราว์เซอร์ที่คุณคิดไว้ คุณควรตรวจสอบใบรับรองที่ลงนามแล้วดูว่าตรงกับค่าที่ถูกต้องหรือไม่
หากคุณกำหนดเป้าหมายเป็น API ระดับ 28 ขึ้นไปและผสานรวมกับเบราว์เซอร์ที่มีใบรับรองที่ลงนามเดียว คุณจะใช้ PackageManager.hasSigningCertificate()
ได้
val packageName: String = … // The caller's package name
val certificate: ByteArray = … // The correct signing certificate.
val verified = packageManager.hasSigningCertificate(
callingPackage,
certificate,
PackageManager.CERT_INPUT_SHA256
)
แนะนำให้ใช้ PackageManager.hasSigningCertificate()
กับเบราว์เซอร์ที่มีใบรับรองรายการเดียว เนื่องจากจัดการการหมุนเวียนใบรับรองได้อย่างถูกต้อง (Chrome มี
ใบรับรองการลงชื่อเพียงครั้งเดียว) แอปที่มีใบรับรองการรับรองหลายรายการจะหมุนเวียนใบรับรองไม่ได้
หากต้องการรองรับ API เวอร์ชันเก่ากว่า 27 ระดับ หรือจำเป็นต้องจัดการเบราว์เซอร์ที่มีใบรับรองการรับรองหลายรายการ ให้ใช้ PackageManager.GET_SIGNATURES
val packageName: String = … // The caller's package name
val certificates: Set<ByteArray> = … // The correct set of signing certificates
val packageInfo = getPackageInfo(packageName, PackageManager.GET_SIGNATURES)
val sha256 = MessageDigest.getInstance("SHA-256")
val signatures = packageInfo.signatures.map { sha256.digest(it.toByteArray()) }
val verified = signatures.size == certificates.size &&
signatures.all { s -> certificates.any { it.contentEquals(s) } }