truescene-face-id-capture-sdk 1.0.0 → 1.0.1
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 +113 -21
- package/dist/_redirects +0 -3
- package/dist/index.js +261 -346
- package/dist/internal/regions.js +5 -0
- package/dist/sdk/CaptureExperience.js +97 -125
- package/dist/sdk/element.js +94 -65
- package/dist/sdk/react/index.js +55 -25
- package/dist/types/internal/regions.d.ts +2 -0
- package/dist/types/sdk/CaptureExperience.d.ts +14 -10
- package/dist/types/sdk/element.d.ts +21 -12
- package/dist/types/sdk/index.d.ts +1 -1
- package/dist/types/sdk/react/index.d.ts +22 -16
- package/dist/types/sdk/types.d.ts +43 -4
- package/dist/utils/config.js +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -2,7 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
Framework-agnostic video capture and ID verification delivered as a Web Component,
|
|
4
4
|
with a thin React wrapper for React apps. The SDK performs the capture flow and
|
|
5
|
-
calls
|
|
5
|
+
calls `https://{region}.api.truescene.ai/comparev2` using a session token you
|
|
6
|
+
provide to obtain a verification code. Your app can use that code to request a
|
|
7
|
+
verification status from your backend.
|
|
6
8
|
|
|
7
9
|
## Install
|
|
8
10
|
|
|
@@ -21,31 +23,60 @@ Import the SDK once to register the custom element, then render it anywhere.
|
|
|
21
23
|
|
|
22
24
|
<truescene-capture
|
|
23
25
|
session-token="YOUR_SESSION_TOKEN"
|
|
24
|
-
|
|
26
|
+
region="us"
|
|
25
27
|
auto-start
|
|
26
28
|
></truescene-capture>
|
|
27
29
|
```
|
|
28
30
|
|
|
31
|
+
### Listening for events
|
|
32
|
+
|
|
33
|
+
```html
|
|
34
|
+
<truescene-capture id="capture" session-token="YOUR_SESSION_TOKEN"></truescene-capture>
|
|
35
|
+
<script>
|
|
36
|
+
const el = document.getElementById('capture')
|
|
37
|
+
el.addEventListener('verification-code', (event) => {
|
|
38
|
+
console.log('Verification code:', event.detail)
|
|
39
|
+
})
|
|
40
|
+
el.addEventListener('verification-error', (event) => {
|
|
41
|
+
console.log('Verification error:', event.detail)
|
|
42
|
+
})
|
|
43
|
+
el.addEventListener('metrics-change', (event) => {
|
|
44
|
+
console.log('Metrics:', event.detail)
|
|
45
|
+
})
|
|
46
|
+
el.addEventListener('capture', (event) => {
|
|
47
|
+
console.log('Images:', event.detail)
|
|
48
|
+
})
|
|
49
|
+
</script>
|
|
50
|
+
```
|
|
51
|
+
|
|
29
52
|
### Attributes
|
|
30
53
|
|
|
31
54
|
- `session-token` (required): token from your backend.
|
|
32
|
-
- `
|
|
33
|
-
- `
|
|
34
|
-
- `token-prefix` (optional): header prefix, default `Bearer`.
|
|
35
|
-
- `token-field` (optional): body field name for the token, default `session_token`.
|
|
55
|
+
- `region` (required): `eu`, `us`, or `sandbox`. The SDK calls `https://{region}.api.truescene.ai/comparev2`.
|
|
56
|
+
- `compare-timeout-ms` (optional): request timeout in milliseconds, default `20000` (`0` disables).
|
|
36
57
|
- `auto-start` (optional): start immediately when token is present.
|
|
37
|
-
- `show-
|
|
38
|
-
- `
|
|
58
|
+
- `show-header` (optional): show the SDK header block, default `true`.
|
|
59
|
+
- `show-instructions` (optional): show the instructions paragraph, default `true`.
|
|
60
|
+
- `show-status` (optional): show the status pills, default `true`.
|
|
61
|
+
- `header-eyebrow` (optional): override the eyebrow label.
|
|
62
|
+
- `header-title` (optional): override the main title line.
|
|
63
|
+
- `header-subtitle` (optional): override the secondary title line.
|
|
64
|
+
- `instructions` (optional): override the instruction copy.
|
|
39
65
|
|
|
40
66
|
### Events
|
|
41
67
|
|
|
42
|
-
- `ready-change`
|
|
43
|
-
- `step-change`
|
|
44
|
-
- `metrics-change`
|
|
45
|
-
- `capture`
|
|
46
|
-
- `
|
|
47
|
-
- `
|
|
48
|
-
- `error`
|
|
68
|
+
- `ready-change` -> `{ faceReady, idReady }`
|
|
69
|
+
- `step-change` -> `CaptureStep`
|
|
70
|
+
- `metrics-change` -> `FaceAndIdCaptureMetrics`
|
|
71
|
+
- `capture` -> `{ faceImage, idImage, fullImage }`
|
|
72
|
+
- `verification-code` -> `VerificationCodeResponse | null`
|
|
73
|
+
- `verification-error` -> `VerificationError | null`
|
|
74
|
+
- `error` -> `string`
|
|
75
|
+
|
|
76
|
+
`verification-code` emits `null` when a compare request starts, then emits the
|
|
77
|
+
final code (or `verification-error`) once the request finishes.
|
|
78
|
+
Requests are aborted when the component unmounts, and timeouts trigger
|
|
79
|
+
`REQUEST_TIMEOUT`.
|
|
49
80
|
|
|
50
81
|
## React wrapper
|
|
51
82
|
|
|
@@ -56,12 +87,53 @@ import TrueSceneCapture from 'truescene-face-capture/react'
|
|
|
56
87
|
|
|
57
88
|
<TrueSceneCapture
|
|
58
89
|
sessionToken={sessionToken}
|
|
59
|
-
|
|
90
|
+
region="us"
|
|
91
|
+
compareTimeoutMs={20000}
|
|
60
92
|
autoStart
|
|
61
|
-
|
|
93
|
+
showHeader
|
|
94
|
+
showInstructions
|
|
95
|
+
showStatus
|
|
96
|
+
onVerificationCode={(result) => console.log(result)}
|
|
97
|
+
onMetricsChange={(metrics) => console.log(metrics)}
|
|
98
|
+
onCapture={(images) => console.log(images)}
|
|
62
99
|
/>
|
|
63
100
|
```
|
|
64
101
|
|
|
102
|
+
### Debug metrics (demo-only)
|
|
103
|
+
|
|
104
|
+
The SDK emits capture metrics through `metrics-change`. If you want a debug
|
|
105
|
+
panel or capture preview cards, build them in your app (as the demo does)
|
|
106
|
+
instead of inside the SDK.
|
|
107
|
+
|
|
108
|
+
### Verification errors
|
|
109
|
+
|
|
110
|
+
`verification-error` provides a stable error object:
|
|
111
|
+
|
|
112
|
+
```ts
|
|
113
|
+
{ code: string; message: string; status?: number }
|
|
114
|
+
```
|
|
115
|
+
|
|
116
|
+
Codes:
|
|
117
|
+
|
|
118
|
+
- `MISSING_TOKEN`
|
|
119
|
+
- `MISSING_REGION`
|
|
120
|
+
- `HTTP_ERROR`
|
|
121
|
+
- `NETWORK_ERROR`
|
|
122
|
+
- `INVALID_RESPONSE`
|
|
123
|
+
- `REQUEST_TIMEOUT`
|
|
124
|
+
|
|
125
|
+
To hide the built-in header/instructions/status UI in the SDK:
|
|
126
|
+
|
|
127
|
+
```html
|
|
128
|
+
<truescene-capture
|
|
129
|
+
session-token="YOUR_SESSION_TOKEN"
|
|
130
|
+
region="us"
|
|
131
|
+
show-header="false"
|
|
132
|
+
show-instructions="false"
|
|
133
|
+
show-status="false"
|
|
134
|
+
></truescene-capture>
|
|
135
|
+
```
|
|
136
|
+
|
|
65
137
|
## Session token flow
|
|
66
138
|
|
|
67
139
|
1. Your backend issues a session token (after authenticating the end user).
|
|
@@ -70,8 +142,28 @@ import TrueSceneCapture from 'truescene-face-capture/react'
|
|
|
70
142
|
- `Authorization: Bearer <token>` header (configurable), and
|
|
71
143
|
- `session_token` field in the request body (configurable).
|
|
72
144
|
|
|
73
|
-
##
|
|
145
|
+
## Verification status (demo only)
|
|
146
|
+
|
|
147
|
+
The SDK only emits `verification_code`. Use that code in your app (or backend)
|
|
148
|
+
to request the verification status. For example:
|
|
149
|
+
|
|
150
|
+
```ts
|
|
151
|
+
await fetch('https://verification.truescene.site/internal/verification/v1/verification/status', {
|
|
152
|
+
method: 'POST',
|
|
153
|
+
headers: {
|
|
154
|
+
'Content-Type': 'application/json',
|
|
155
|
+
'X-TRUESCENE-API-KEY': 'YOUR_API_KEY',
|
|
156
|
+
},
|
|
157
|
+
body: JSON.stringify({
|
|
158
|
+
verification_code,
|
|
159
|
+
include_extracted_data: true,
|
|
160
|
+
}),
|
|
161
|
+
})
|
|
162
|
+
```
|
|
163
|
+
|
|
164
|
+
In production, do this exchange on your backend to avoid exposing API keys in
|
|
165
|
+
the browser.
|
|
166
|
+
|
|
167
|
+
## Contributing
|
|
74
168
|
|
|
75
|
-
|
|
76
|
-
- `npm run build:demo` builds the demo app to `dist-demo/`.
|
|
77
|
-
- `npm run build` builds the SDK to `dist/`.
|
|
169
|
+
See `CONTRIBUTING.md` for local development and build workflows.
|
package/dist/_redirects
CHANGED