보안 결제 확인 등록

거래에서 보안 결제 확인 (SPC)을 사용하려는 고객은 다음 요건을 충족해야 합니다. 인증자를 등록해야 합니다 이 프로세스는 웹 인증의 WebAuthn 추가 결제 기한 연장을 통해 신청 기간을 연장할 수 있습니다.

이 도움말에서 신뢰 당사자 (RP) 역할을 하는 발급 은행은 SPC 등록을 구현할 수 있습니다 사용자 환경은 보안 결제 확인 개요를 참조하세요.

보안 결제 확인 등록은 어떻게 작동하나요?

SPC는 WebAuthn 표준에 대한 확장 프로그램으로 빌드되었습니다.

2022년 4월부터 SPC는 사용자 인증 플랫폼 인증자만 지원합니다. (UVPA)를 표시합니다. 즉, 고객이 데스크톱이나 노트북을 이용 중이어야 합니다. 다음과 같은 삽입된 인증자를 사용합니다.

  • macOS 기기에서 Touch 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 부분은 도메인이 등록된 위치와 일치해야 합니다. 다음에 사용할 수 있습니다. 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")
    

다음 단계

기기가 신뢰 당사자에 등록되면 고객은 판매자 웹사이트에서 보안 결제 확인을 사용하여 결제를 확인할 수 있습니다.