Request or download the MATTR Pi SDK Trial Licence Agreement and the MATTR Customer Agreement and review these terms carefully.
The Verifier Web SDK is a powerful tool for integrating online credential verification capabilities into your web applications. It enables secure and efficient verification of verifiable credentials, supporting both same-device and cross-device flows. The SDK leverages the MATTR VII platform to handle credential presentation and verification processes.
Refer to our SDK Docs landing page for step-by-step instructions to gain access to any of our SDKs.
Please reach out if you need any assistance.
yarn add @mattrglobal/verifier-sdk-web@0.1.1-preview.1365
import * as MATTRVerifierSDK from "@mattrglobal/verifier-sdk-web";
MATTRVerifierSDK.initialise(...);
<script src="https://cdn.mattr.global/js/verifer-sdk-web/latest/verifier-js.production.js"></script>
MATTRVerifierSDK
object.<script>
MATTRVerifierSDK.initialise(...);
</script>
MATTRVerifierSDK.initialise({ apiBaseUrl });
[!NOTE] The
apiBaseUrl
should be thetenant_url
of your MATTR VII verifier tenant.
Example credential query to request the birthdate
and portrait
claims in a mobile
credential of type org.iso.18013.5.1.mDL
:
const credentialQuery = {
"profile": "mobile",
"docType": "org.iso.18013.5.1.mDL",
"nameSpaces": {
"org.iso.18013.5.1": {
"birthdate": {
"intentToRetain": false
},
"portrait": {},
"resident_postal_code": {
"intentToRetain": false
}
},
}
};
[!NOTE] The API supports multiple queries in one request. For simplicity, this example only includes a single query.
The walletProviderId
and redirectUri
parameters are defined as part of your MATTR VII tenant verifier configuration and must match the values provided in the credential request (see examples below).
Refer to the API Reference for more information on these parameters and how to set them.
The purpose of generating a challenge is to ensure the security and integrity of the credential verification process by preventing replay attacks and verifying the authenticity of each request and response. Refer to the examples below that demonstrate how to generate this challenge as part of the credential request.
The same-device flow involves the user completing all steps on a single device, such as their smartphone. They initiate the credential request on the verifier's web app, are redirected to their wallet app to consent and present credentials, and then return to the verifier's web app with the results.
In contrast, the cross-device flow starts on one device, like a laptop, where the user initiates the request and receives a QR code. They then scan this QR code with their smartphone, use their wallet app to present credentials, and the results are sent back to the verifier's web app.
The main difference is that the same-device flow uses only one device for the entire process, while the cross-device flow uses two devices for added flexibility.
By default, the Verifier Web SDK automatically detects whether to use the same-device or cross-device flow based on the browser's user agent. However, this behavior can be explicitly overridden by specifying the desired mode in the SDK configuration.
MATTRVerifierSDK.initialise({ apiBaseUrl });
const result = await MATTRVerifierSDK.requestCredentials({
credentialQuery: [credentialQuery],
challenge: MATTRVerifierSDK.utils.generateChallenge(),
walletProviderId,
mode: undefined, // auto detection base on browser user agent
redirectUri, // required fields for same device mode
crossDeviceCallback: { // required fields for cross device mode
onComplete: (result) => {
console.info("<<< MATTRVerifierSDK.requestCredentials crossDeviceCallback.onComplete", result);
},
onFailure: (error) => {
console.info("<<< MATTRVerifierSDK.requestCredentials crossDeviceCallback.onFailure", error);
},
},
});
MATTRVerifierSDK.initialise({ apiBaseUrl });
const result = await MATTRVerifierSDK.requestCredentials({
credentialQuery: [credentialQuery],
challenge: MATTRVerifierSDK.utils.generateChallenge(),
redirectUri,
walletProviderId,
mode: "sameDevice",
});
// result can be retrieved on redirect uri page. for example
window.addEventListener("load", async () => {
MATTRVerifierSDK.initialise({ apiBaseUrl });
const result = await MATTRVerifierSDK.handleRedirectCallback();
});
MATTRVerifierSDK.initialise({ apiBaseUrl });
const result = await MATTRVerifierSDK.requestCredentials({
credentialQuery: [credentialQuery],
challenge: MATTRVerifierSDK.utils.generateChallenge(),
walletProviderId,
mode: "crossDevice",
crossDeviceCallback: {
onComplete: (result) => {
console.info("<<< MATTRVerifierSDK.requestCredentials crossDeviceCallback.onComplete", result);
},
onFailure: (error) => {
console.info("<<< MATTRVerifierSDK.requestCredentials crossDeviceCallback.onFailure", error);
},
},
});
The SDK includes mechanisms for handling errors, such as invalid requests, session timeouts, and user aborts. Callbacks provide detailed error information to help diagnose and remedy issues.
[Unreleased]
Generated using TypeDoc