Để sử dụng tính năng Xác nhận thanh toán an toàn (SPC) trong một giao dịch, trước tiên, khách hàng phải đăng ký một trình xác thực. Quá trình này rất giống với quy trình đăng ký WebAuthn, với việc bổ sung tiện ích thanh toán.
Trong bài viết này, các ngân hàng phát hành đóng vai trò là bên tin cậy (RP) có thể tìm hiểu cách triển khai việc đăng ký SPC. Trải nghiệm người dùng được giải thích thêm trong phần tổng quan về tính năng Xác nhận thanh toán an toàn.
Quy trình đăng ký tính năng Xác nhận thanh toán an toàn hoạt động như thế nào?
SPC được xây dựng dưới dạng một phần mở rộng của tiêu chuẩn WebAuthn.
Kể từ tháng 4 năm 2022, SPC chỉ hỗ trợ Trình xác thực nền tảng xác minh người dùng (UVPA) trên máy tính. Điều này có nghĩa là khách hàng cần sử dụng máy tính để bàn hoặc máy tính xách tay có trình xác thực được nhúng, chẳng hạn như:
- Tính năng mở khoá bao gồm cả Touch ID trên thiết bị macOS
- Windows Hello trên thiết bị Windows
Đăng ký thiết bị
Quy trình đăng ký thiết bị của bên phụ thuộc (RP) phải tuân theo quy trình xác minh người dùng đủ mạnh. RP phải đảm bảo rằng khách hàng đã đăng nhập vào trang web bằng phương thức xác thực mạnh để tài khoản không dễ bị xâm nhập. Hãy cẩn thận: việc thiếu tính bảo mật trong quy trình này cũng khiến SPC gặp rủi ro.
Sau khi RP xác thực thành công khách hàng, khách hàng hiện có thể đăng ký một thiết bị.
Phát hiện tính năng
Trước khi yêu cầu khách hàng đăng ký thiết bị, RP phải kiểm tra để đảm bảo rằng trình duyệt hỗ trợ SPC.
const isSecurePaymentConfirmationSupported = async () => {
if (!'PaymentRequest' in window) {
return [false, 'Payment Request API is not supported'];
}
try {
// The data below is the minimum required to create the request and
// check if a payment can be made.
const supportedInstruments = [
{
supportedMethods: "secure-payment-confirmation",
data: {
// RP's hostname as its ID
rpId: 'rp.example',
// A dummy credential ID
credentialIds: [new Uint8Array(1)],
// A dummy challenge
challenge: new Uint8Array(1),
instrument: {
// Non-empty display name string
displayName: ' ',
// Transparent-black pixel.
icon: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+P+/HgAFhAJ/wlseKgAAAABJRU5ErkJggg==',
},
// A dummy merchant origin
payeeOrigin: 'https://non-existent.example',
}
}
];
const details = {
// Dummy shopping details
total: {label: 'Total', amount: {currency: 'USD', value: '0'}},
};
const request = new PaymentRequest(supportedInstruments, details);
const canMakePayment = await request.canMakePayment();
return [canMakePayment, canMakePayment ? '' : 'SPC is not available'];
} catch (error) {
console.error(error);
return [false, error.message];
}
};
isSecurePaymentConfirmationSupported().then(result => {
const [isSecurePaymentConfirmationSupported, reason] = result;
if (isSecurePaymentConfirmationSupported) {
// Display the payment button that invokes SPC.
} else {
// Fallback to the legacy authentication method.
}
});
Đăng ký trình xác thực
Để đăng ký thiết bị cho SPC, hãy làm theo quy trình đăng ký WebAuthn với các yêu cầu sau:
- Bắt buộc phải có trình xác thực nền tảng:
authenticatorSelection.authenticatorAttachmentlàplatform. - Yêu cầu xác minh người dùng:
authenticatorSelection.userVerificationlàrequired. - Bạn phải có thông tin xác thực có thể phát hiện (khoá thường trú):
authenticatorSelection.residentKeylàrequired.
Ngoài ra, hãy chỉ định tiện ích "thanh toán" bằng isPayment: true. Việc chỉ định phần mở rộng này mà không đáp ứng các yêu cầu trên sẽ gửi một ngoại lệ
Một số lưu ý khác:
rp.id: tên máy chủ của RP. Phần eTLD+1 của miền phải khớp với nơi miền đó được đăng ký. Bạn có thể dùng mã này để xác thực trên các miền khớp với eTLD+1.user.id: biểu thức nhị phân của giá trị nhận dạng người dùng. Giá trị nhận dạng này sẽ được trả về khi xác thực thành công, vì vậy, RP phải cung cấp giá trị nhận dạng người dùng nhất quán của chủ thẻ.excludeCredentials: một mảng thông tin xác thực để RP có thể tránh đăng ký cùng một trình xác thực.
Để biết thêm về quy trình đăng ký WebAuthn, hãy tham khảo webauthn.guide.
Mã đăng ký mẫu:
const options = {
challenge: new Uint8Array([21...]),
rp: {
id: "rp.example",
name: "Fancy Bank",
},
user: {
id: new Uint8Array([21...]),
name: "jane.doe@example.com",
displayName: "Jane Doe",
},
excludeCredentials: [{
id: new Uint8Array([21...]),
type: 'public-key',
transports: ['internal'],
}, ...],
pubKeyCredParams: [{
type: "public-key",
alg: -7 // "ES256"
}, {
type: "public-key",
alg: -257 // "RS256"
}],
authenticatorSelection: {
userVerification: "required",
residentKey: "required",
authenticatorAttachment: "platform",
},
timeout: 360000, // 6 minutes
// Indicate that this is an SPC credential. This is currently required to
// allow credential creation in an iframe, and so that the browser knows this
// credential relates to SPC.
extensions: {
"payment": {
isPayment: true,
}
}
};
try {
const credential = await navigator.credentials.create({ publicKey: options });
// Send new credential info to server for verification and registration.
} catch (e) {
// No acceptable authenticator or user refused consent. Handle appropriately.
}
Sau khi đăng ký thành công, RP sẽ nhận được thông tin xác thực để gửi đến máy chủ nhằm xác minh.
Xác minh thông tin đăng ký
Trên máy chủ, RP phải xác minh thông tin xác thực và giữ lại khoá công khai để sử dụng sau này. Quy trình đăng ký phía máy chủ giống với quy trình đăng ký WebAuthn thông thường. Bạn không cần làm gì thêm để tuân thủ SPC.
Đăng ký từ bên trong iframe
Nếu người thanh toán chưa đăng ký thiết bị của họ với RP (nhà phát hành thanh toán), thì người thanh toán có thể đăng ký trên trang web của người bán. Sau khi xác thực thành công trong quá trình mua hàng, RP có thể yêu cầu người thanh toán đăng ký thiết bị của họ gián tiếp, từ trong một iframe.
Để làm như vậy, người bán hoặc trang web gốc phải cho phép rõ ràng hành động này trong một khung hiển thị nội tuyến bằng cách sử dụng Chính sách về quyền. Bên phát hành tuân theo các bước tương tự để đăng ký trình xác thực trong một iframe.
Người bán có thể cho phép đăng ký theo hai cách:
Thẻ iframe trong HTML được phân phát từ miền của người bán sẽ thêm thuộc tính
allow:<iframe name="iframe" allow="payment https://spc-rp.glitch.me"></iframe>Đảm bảo thuộc tính
allowchứapaymentvà nguồn gốc RP gọi lệnh đăng ký WebAuthn.Tài liệu khung mẹ (được phân phát từ miền của người bán) được gửi bằng tiêu đề HTTP
Permissions-Policy:Permissions-Policy: payment=(self "https://spc-rp.glitch.me")
Các bước tiếp theo
Sau khi thiết bị được đăng ký cho bên phụ thuộc, khách hàng có thể xác nhận thanh toán trên trang web của người bán bằng tính năng Xác nhận thanh toán an toàn.
- Tìm hiểu cách xác thực bằng Thông báo xác nhận thanh toán an toàn
- Đọc thông tin tổng quan về tính năng Xác nhận thanh toán an toàn