Om Secure Payment Confirmation (SPC) in een transactie te gebruiken, moet de klant eerst een authenticator registreren. Dit proces lijkt sterk op het WebAuthn-registratieproces, met de toevoeging van een betalingsextensie.
In dit artikel kunnen uitgevende banken die optreden als vertrouwende partijen (RP's) leren hoe ze SPC-registratie kunnen implementeren. De gebruikerservaring wordt verder toegelicht in het overzicht van Veilige Betaalbevestiging .
Hoe werkt de registratie via Veilige Betalingsbevestiging?
SPC is gebouwd als een uitbreiding op de WebAuthn-standaard.
Vanaf april 2022 ondersteunt SPC alleen User Verifying Platform Authenticators (UVPA) op desktop. Dit betekent dat de klant een desktop of laptop nodig heeft met een ingebouwde authenticator zoals:
- Ontgrendelingsfunctie inclusief Touch ID op een macOS-apparaat
- Windows Hello op een Windows-apparaat
Registreer het apparaat
De registratie van een apparaat door de Relying Party (RP's) moet een voldoende sterk gebruikersverificatieproces volgen. De RP moet ervoor zorgen dat de klant zich met sterke authenticatie op de website heeft aangemeld, zodat het account niet gemakkelijk kan worden gekaapt. Wees voorzichtig: een gebrek aan veiligheid in dit proces brengt ook SPC in gevaar.
Zodra de RP de klant succesvol heeft geverifieerd, kan de klant nu een apparaat registreren.
Functiedetectie
Voordat de klant wordt gevraagd het apparaat te registreren, moet de RP controleren of de browser SPC ondersteunt.
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.
}
});
Registreer een authenticator
Om een apparaat voor SPC te registreren, volgt u het WebAuthn-registratieproces met de volgende vereisten:
- De platformauthenticator is vereist:
authenticatorSelection.authenticatorAttachment
isplatform
. - De gebruikersverificatie is vereist:
authenticatorSelection.userVerification
isrequired
. - Er zijn detecteerbare inloggegevens (residente sleutels) vereist:
authenticatorSelection.residentKey
isrequired
.
Geef bovendien een "betalingsextensie" op met isPayment: true
. Als u deze extensie opgeeft zonder aan de bovenstaande vereisten te voldoen, wordt er een uitzondering gegenereerd
Enkele andere kanttekeningen:
-
rp.id
: de hostnaam van de RP. Het eTLD+1- gedeelte van het domein moet overeenkomen met waar het wordt geregistreerd. Het kan worden gebruikt voor authenticatie op domeinen die overeenkomen met eTLD+1. -
user.id
: een binaire uitdrukking van de gebruikers-ID. Bij succesvolle authenticatie wordt dezelfde identificatie geretourneerd, dus de RP moet een consistente gebruikersidentificatie van de kaarthouder verstrekken. -
excludeCredentials
: een reeks referenties zodat de RP kan voorkomen dat dezelfde authenticator wordt geregistreerd.
Voor meer informatie over het WebAuthn-registratieproces raadpleegt u webauthn.guide .
Voorbeeld registratiecode:
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.
}
Na een succesvolle registratie ontvangt de RP een inloggegevens die ter verificatie naar de server moet worden gestuurd.
Controleer de registratie
Op de server moet de RP de inloggegevens verifiëren en de openbare sleutel bewaren voor later gebruik. Het registratieproces op de server is hetzelfde als bij een gewone WebAuthn-registratie . Er is niets extra's vereist om aan de SPC te voldoen.
Registratie vanuit een iframe
Als de betaler zijn apparaat niet heeft geregistreerd bij de RP (betalingsverstrekker), kan de betaler zich registreren op de website van de verkoper. Na een succesvolle authenticatie tijdens een aankoop kan de RP de betaler verzoeken zijn apparaat indirect, vanuit een iframe, te registreren.
Om dit te doen, moet de verkoper of ouder deze actie expliciet toestaan binnen een iframe met behulp van het Permissiebeleid . De uitgever volgt dezelfde stappen om een authenticator binnen een iframe te registreren .
Er zijn twee manieren waarop de verkoper registratie kan toestaan:
De iframe-tag in de HTML die wordt weergegeven vanuit het verkopersdomein voegt een
allow
attribuut toe:<iframe name="iframe" allow="payment https://spc-rp.glitch.me"></iframe>
Zorg ervoor dat het
allow
-kenmerkpayment
bevat en de RP-oorsprong die WebAuthn-registratie aanroept.Het bovenliggende framedocument (geleverd vanuit het verkopersdomein) wordt verzonden met een
Permissions-Policy
HTTP-header:Permissions-Policy: payment=(self "https://spc-rp.glitch.me")
Volgende stappen
Zodra een apparaat bij de vertrouwende partij is geregistreerd, kan de klant betalingen op de website van de verkoper bevestigen met behulp van Veilige betalingsbevestiging.
- Leer hoe u zich kunt authenticeren met een beveiligde betalingsbevestiging
- Lees het overzicht van Veilige Betaalbevestiging