如需在交易中使用安全付款确认 (SPC),客户必须先注册身份验证器。此流程与 WebAuthn 注册流程非常相似,只是增加了付款扩展功能。
在本文中,充当依赖方 (RP) 的发卡银行可以了解如何实现 SPC 注册。安全付款确认概览中进一步说明了用户体验。
安全付款确认注册是如何运作的?
SPC 是作为 WebAuthn 标准的扩展构建的。
自 2022 年 4 月起,SPC 仅支持在桌面设备上进行用户验证平台身份验证器 (UVPA)。这意味着客户需要使用带有嵌入式身份验证器的台式机或笔记本电脑,例如:
- macOS 设备上的解锁功能(包括触控 ID)
- Windows 设备上的 Windows Hello
注册设备
设备依赖方 (RP) 的注册应遵循足够强的用户验证流程。RP 必须确保客户已使用强身份验证登录网站,以防止帐号被轻易盗用。请注意:此流程中的不安全因素也会使 SPC 面临风险。
在 RP 成功对客户进行身份验证后,客户现在就可以注册设备了。
功能检测
在请客户注册设备之前,RP 必须检查浏览器是否支持 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.
}
});
注册身份验证器
如需为设备注册 SPC,请按照 WebAuthn 注册流程操作,并满足以下要求:
- 必须提供平台身份验证器:
authenticatorSelection.authenticatorAttachment
为platform
。 - 需要进行用户验证:
authenticatorSelection.userVerification
为required
。 - 必须提供可检测到的凭据(常驻密钥):
authenticatorSelection.residentKey
为required
。
此外,还要使用 isPayment: true
指定“付款”延期。如果不满足上述要求,指定此扩展程序,则会引发异常
其他一些注意事项:
rp.id
:RP 的主机名。网域的 eTLD+1 部分必须与它的注册位置一致。它可用于在与 eTLD+1 匹配的网域上进行身份验证。user.id
:用户标识符的二进制表达式。身份验证成功后,系统会返回相同的标识符,因此 RP 应提供一致的持卡人用户标识符。excludeCredentials
:一个凭据数组,用于让 RP 可以避免注册相同的身份验证器。
如需详细了解 WebAuthn 注册流程,请参阅 webauthn.guide。
注册代码示例:
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.
}
注册成功后,RP 会收到一个凭据,将其发送给服务器进行验证。
验证注册
在服务器上,RP 必须验证凭据并保存公钥以供日后使用。服务器端注册流程与普通 WebAuthn 注册相同。为遵守 SPC,您无需执行任何其他操作。
在 iframe 中注册
如果付款人未向 RP(付款发卡机构)注册其设备,则付款人可以在商家网站上注册。在购买交易期间成功进行身份验证后,RP 可以请求付款人在 iframe 中间接注册设备。
为此,商家或父级必须使用权限政策明确允许在 iframe 中执行此操作。颁发者遵循相同的步骤在 iframe 中注册身份验证器。
商家可以通过以下两种方法允许注册:
商家网域提供的 HTML 中的 iframe 代码会添加一个
allow
属性:<iframe name="iframe" allow="payment https://spc-rp.glitch.me"></iframe>
确保
allow
属性包含payment
以及调用 WebAuthn 注册的 RP 来源。父框架文档(通过商家网域提供)通过
Permissions-Policy
HTTP 标头发送:Permissions-Policy: payment=(self "https://spc-rp.glitch.me")
后续步骤
在依赖方注册设备后,客户就可以使用安全付款确认功能在商家网站上确认付款。
- 了解如何使用安全付款确认功能进行身份验证
- 阅读安全付款确认概述