注册安全付款确认

要在交易中使用安全付款确认 (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.authenticatorAttachmentplatform
  • 必须进行用户验证: authenticatorSelection.userVerificationrequired
  • 必须提供可检测到的凭据(常驻密钥): authenticatorSelection.residentKeyrequired

此外,请指定“付款”包含 isPayment: true 的扩展程序。指定 此扩展程序就会抛出异常

其他注意事项:

  • rp.id:RP 的主机名。 域名必须与注册地址相匹配。它可用于 针对与 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 中注册身份验证器

商家可通过以下两种方式允许注册:

  1. 商家网域提供的 HTML 中的 iframe 代码会添加一个 allow 属性:

    <iframe name="iframe" allow="payment https://spc-rp.glitch.me"></iframe>
    

    请确保 allow 属性包含 payment 和调用 WebAuthn 注册的 RP 源。

  2. 系统会发送父框架文档(由商家网域提供)和 Permissions-Policy HTTP 标头:

    Permissions-Policy: payment=(self "https://spc-rp.glitch.me")
    

后续步骤

将设备注册到依赖方后,客户就可以在商家网站上使用安全付款确认功能来确认付款。