client-verification-trential-next-sdk
v0.0.9
Published
Installation
Downloads
209
Readme
Installation
npm install client-verification-trential-sdk
This SDK is supported on React (on version 16 and above) and NextJS (13.0.4)
The Vendor Client will hit the following API and send payload to generate a session token
Backend API call
curl --location --request POST '
https://api.trential.dev/verification/api/1.0/transactions/start-group-verification'
\
--header 'x-api-key: TRENTIAL_ORG_API_KEY' \
--header 'Content-Type: application/json' \
--data-raw '{
"verificationNameList": ["aadhaar","dl","passport"]
}'
Response
{
"code": 0,
"message": "Success",
"data": {
"transactionId": "660bef7e6bbda02fb731b850",
"token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJvcmd1aWQiOiI2NTk0MGJkYjliMjcxZDdlMTIzYTkwY2MiLCJncm91cFR4bklkIjoiNjYwYmVmN2U2YmJkYTAyZmI3MzFiODUwIiwidHlwZSI6ImFjY2VzcyIsImlhdCI6MTcxMjA1ODI0NSwiZXhwIjoxNzEyMDYwMDQ1fQ.zBuW6aW4QdwZF2oLC1ZUqRuKq3h0ZfdpJlFYbbXpt7Q"
}
}
On receiving the response, inject the token in the client SDK as follows
import { ClientVerificationUI } from '@trential/client-verification-sdk'
// component
<ClientVerificationUI
token={"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJvcmd1aWQiOiI2NTk0MGJkYjliMjcxZDdlMTIzYTkwY2MiLCJncm91cFR4bklkIjoiNjYwYmVmN2U2YmJkYTAyZmI3MzFiODUwIiwidHlwZSI6ImFjY2VzcyIsImlhdCI6MTcxMjA1ODI0NSwiZXhwIjoxNzEyMDYwMDQ1fQ.zBuW6aW4QdwZF2oLC1ZUqRuKq3h0ZfdpJlFYbbXpt7Q"}
onSuccess={()=> successHandler()}
onError={()=> errorHandler()}
/>
The ClientVerificationUI component can be rendered anywhere but it is best suited inside a modal view which will provide a better user experience
The token will be used to start the session and all the verifications will be listed accordingly
| Props | Description | Type | |------------|-----------------------------------------------------------|----------| | token | Required to start the session | string | | disclaimer | Rendered on Aadhaar Card Verification Screen | string | | onSuccess | Function called on successful verification | function | | onError | Function called on verification error | function |
Example Code
import axios from "axios";
import React from "react";
import { ClientVerificationUI } from "client-verification-trential-sdk";
function TrentialDemo() {
const [token, setToken] = React.useState();
// generate session token
const generateSessionToken = async () => {
const response = await axios({
url: "https://api.trential.dev/verification/api/1.0/transactions/start-group-verification",
method: "POST",
headers: {
"x-api-key": "8d388308-4023-4f83-94a3-9351c72a6690",
},
data: {
verificationNameList: ["aadhaar", "dl", "passport"],
},
});
if (response?.data?.data) {
setToken(response?.data?.data?.token);
}
};
const invokeSDK = () => {
if (!token) {
generateSessionToken();
}
};
return (
<div className="App">
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
{token && (
<div style={{ margin: 20 }}>
<ClientVerificationUI
onError={() => {}}
onSuccess={() => alert("hey")}
verifications={["aadhaar", "passport", "drivingLicense"]}
token={token}
disclaimer="I provide my consent to share my Aadhaar Card with Hudini"
/>
<p style={{ marginTop: 20 }}>
Powered by{" "}
<img
src="https://storage.googleapis.com/indisi-wallet-app/trential-logo-white-bg.png"
style={{ height: 40, width: "auto" }}
/>
</p>
</div>
)}
</div>
</div>
</div>
<h1>Client Verification SDK Testing Sandbox</h1>
<button
type="button"
style={{ backgroundColor: "rgb(4,77,160)" }}
onClick={() => invokeSDK()}
class="btn btn-info btn-lg"
data-toggle="modal"
data-target="#myModal"
>
Invoke SDK
</button>
<br />
<div>
<p>token - {token ? "Intialised" : "Not Initialised"}</p>
</div>
</div>
);
}
export default TrentialDemo;
Update on Upcoming SDK Version
🚀 More customization is on the way in client-side verification SDK:-
The developer would have an option to choose m out of n verifications, that is the choice for developers to pick specific verifications from a set.
The developer would be able to set conditions whether to restart the verification whenever the client-verification-sdk is invoked or re-use earlier session