@mosip/react-inji-verify-sdk 0.15.0-beta.3 → 0.15.0-beta.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/Readme.md
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
# INJI VERIFY SDK
|
|
2
2
|
|
|
3
|
-
Inji Verify SDK provides ready-to-use **React components** to integrate [OpenID4VP](https://openid.net/specs/openid-4-verifiable-presentations-1_0.html)-based **Verifiable Credential (VC) verification** into any React TypeScript web application.
|
|
3
|
+
Inji Verify SDK provides ready-to-use **React components** to integrate [OpenID4VP](https://openid.net/specs/openid-4-verifiable-presentations-1_0.html)-based **Verifiable Credential (VC) and Verifiable Presentation (VP) verification** into any React TypeScript web application.
|
|
4
4
|
|
|
5
5
|
|
|
6
|
-
##
|
|
6
|
+
## Usage Guide
|
|
7
7
|
|
|
8
8
|
### Step 1: Install the Package
|
|
9
9
|
```bash
|
|
@@ -36,7 +36,7 @@ function MyApp() {
|
|
|
36
36
|
}
|
|
37
37
|
```
|
|
38
38
|
|
|
39
|
-
**Option B:
|
|
39
|
+
**Option B: OpenID4VP Verification**
|
|
40
40
|
```javascript
|
|
41
41
|
function MyApp() {
|
|
42
42
|
return (
|
|
@@ -55,9 +55,9 @@ function MyApp() {
|
|
|
55
55
|
}
|
|
56
56
|
```
|
|
57
57
|
|
|
58
|
-
##
|
|
58
|
+
## Response Received
|
|
59
59
|
|
|
60
|
-
When verification is
|
|
60
|
+
When verification is completed, the response received is as below:
|
|
61
61
|
|
|
62
62
|
```javascript
|
|
63
63
|
{
|
|
@@ -70,8 +70,13 @@ When verification is complete, you'll receive results like this:
|
|
|
70
70
|
vpResultStatus: "SUCCESS" // Overall verification status
|
|
71
71
|
}
|
|
72
72
|
```
|
|
73
|
+
>**Security Recommendation**
|
|
74
|
+
>
|
|
75
|
+
>Avoid consuming results directly from VPProcessed or VCProcessed.
|
|
76
|
+
Instead, use VPReceived or VCReceived events to capture the txnId, then retrieve the verification results securely from your backend's verification service endpoint.
|
|
77
|
+
This ensures data integrity and prevents reliance on client-side verification data for final decisions.
|
|
73
78
|
|
|
74
|
-
##
|
|
79
|
+
## Pre-requisites
|
|
75
80
|
|
|
76
81
|
### What You Need:
|
|
77
82
|
1. **A React project** (TypeScript recommended)
|
|
@@ -194,36 +199,36 @@ presentationDefinition={{
|
|
|
194
199
|
|
|
195
200
|
### Common Props (Both Components)
|
|
196
201
|
|
|
197
|
-
| Property
|
|
198
|
-
|
|
199
|
-
| `verifyServiceUrl` | string
|
|
200
|
-
| `onError`
|
|
201
|
-
| `triggerElement`
|
|
202
|
-
| `transactionId`
|
|
202
|
+
| Property | Type | Required | Description |
|
|
203
|
+
|--------------------|---------------|----------|---------------------------------------------|
|
|
204
|
+
| `verifyServiceUrl` | string | ✅ | Your backend verification URL |
|
|
205
|
+
| `onError` | function | ✅ | What to do when something goes wrong |
|
|
206
|
+
| `triggerElement` | React element | ❌ | Custom button/element to start verification |
|
|
207
|
+
| `transactionId` | string | ❌ | Your own tracking ID |
|
|
203
208
|
|
|
204
209
|
### QRCodeVerification Specific
|
|
205
210
|
|
|
206
|
-
| Property
|
|
207
|
-
|
|
208
|
-
| `onVCProcessed`
|
|
209
|
-
| `onVCReceived`
|
|
210
|
-
| `isEnableUpload`
|
|
211
|
-
| `isEnableScan`
|
|
212
|
-
| `isEnableZoom`
|
|
213
|
-
| `uploadButtonStyle` | object
|
|
211
|
+
| Property | Type | Default | Description |
|
|
212
|
+
|---------------------|----------|---------|------------------------------|
|
|
213
|
+
| `onVCProcessed` | function | - | Get full results immediately |
|
|
214
|
+
| `onVCReceived` | function | - | Get transaction ID only |
|
|
215
|
+
| `isEnableUpload` | boolean | true | Allow file uploads |
|
|
216
|
+
| `isEnableScan` | boolean | true | Allow camera scanning |
|
|
217
|
+
| `isEnableZoom` | boolean | true | Allow camera zoom |
|
|
218
|
+
| `uploadButtonStyle` | object | - | Custom upload button styling |
|
|
214
219
|
|
|
215
220
|
### OpenID4VPVerification Specific
|
|
216
221
|
|
|
217
|
-
| Property
|
|
218
|
-
|
|
219
|
-
| `protocol`
|
|
220
|
-
| `presentationDefinitionId` | string
|
|
221
|
-
| `presentationDefinition`
|
|
222
|
-
| `onVpProcessed`
|
|
223
|
-
| `onVpReceived`
|
|
224
|
-
| `onQrCodeExpired`
|
|
225
|
-
| `isEnableSameDeviceFlow`
|
|
226
|
-
| `qrCodeStyles`
|
|
222
|
+
| Property | Type | Default | Description |
|
|
223
|
+
|----------------------------|----------|----------------|------------------------------------|
|
|
224
|
+
| `protocol` | string | "openid4vp://" | Protocol for QR codes (optional) |
|
|
225
|
+
| `presentationDefinitionId` | string | - | Predefined verification template |
|
|
226
|
+
| `presentationDefinition` | object | - | Custom verification rules |
|
|
227
|
+
| `onVpProcessed` | function | - | Get full results immediately |
|
|
228
|
+
| `onVpReceived` | function | - | Get transaction ID only |
|
|
229
|
+
| `onQrCodeExpired` | function | - | Handle QR code expiration |
|
|
230
|
+
| `isEnableSameDeviceFlow` | boolean | true | Enable same-device flow (optional) |
|
|
231
|
+
| `qrCodeStyles` | object | - | Customize QR code appearance |
|
|
227
232
|
|
|
228
233
|
## ⚠️ Important Limitations
|
|
229
234
|
|
|
@@ -40,11 +40,6 @@ export interface VPRequestBody {
|
|
|
40
40
|
presentationDefinitionId?: string;
|
|
41
41
|
presentationDefinition?: PresentationDefinition;
|
|
42
42
|
}
|
|
43
|
-
export interface Wallet {
|
|
44
|
-
name: string;
|
|
45
|
-
scheme: string;
|
|
46
|
-
icon: string;
|
|
47
|
-
}
|
|
48
43
|
type ExclusivePresentationDefinition =
|
|
49
44
|
/**
|
|
50
45
|
* ID of the presentation definition used for verification.
|