Server-side Scan Creation
User Flow with Server Side Scan Creation
- You create a scan server-side by posting a request to
/api/v1/scan
and Dyneti's server responds with a scan id - You prompt your user to verify their credit card.
- You show your card scanning UI. You specify where to attach the DyScan IFrame, and which scan id to perform.
- Your front-end code will receive callbacks with the current state of the scan. You can update your UI to show progress, errors, or prompts required
- Your user holds their credit or debit card up to their camera so that the digits are visible. The video stream is sent back to Dyneti servers, where the images are processed by Dyneti's proprietary deep learning models.
- The card images are redacted and stored for use through our Reviews API. The unredacted images are deleted immediately after use. The authenticity and integrity of the scan can be verified using our Integrity Check API.
- Dyneti's decision on whether or not a card was fraudulent and why as well as whether cardholder name and number match what we expected can be fetched from our Scan Results API (see below for details). Your front-end code is notified that the scan is complete.
Starting a DyScan View Verification with Server-side Scan Creation
To create a scan, post a request to /api/v1/scan
. The body should be json
Headers
X-API-KEY
Your publishable api key
Body
verify
A Verification Request
options
An object specifying the configuration of the scan. For a full explanation of these option see the Scan Configuration documentation
{
"verify": {
...
},
"options": {
...
}
}
Response
The server will respond with a JSON object:
{
"id": "xxx-example-scan-id",
"scanFlowUrl": "https://dyscanweb.dyneti.com/scan/xxx-example-scan-id",
"qrCodeImageUrl": "https://dyscanweb.dyneti.com/scan/xxx-example-scan-id/qr"
}
Attaching the ScanView
Once you have an id
for your scan from the previous step, you can attach the ScanView to the DOM and show the UI to your user.
To attach the ScanView element to your scanning UI you first create a ScanView
const scanView = new DyScan.ScanView({
key: "<your shareable api key>",
})
Then you can attach the scanView
to your DOM
const verify = {
scanId: "<scan id>" // pass in the id returned from posting to /api/v1/scan
}
// Callbacks to customize behavior as the scan progresses.
const onPromptUser = (message) => {
...
}
// Handle network errors
const onError = (scanError) => {
...
};
// Use the onProgress callback to update UI elements in response to the scan progressing.
const onProgress = (message) => {
...
}
// onAnalysis is called when the end user doesn't need to hold up their card anymore, but the result may not be available yet.
const onAnalysis = () => {
...
};
// onScanStarted is called when the scan starts
const onScanStarted = () => {
...
};
const viewOptions = {
onPromptUser,
onError,
onProgress,
onAnalysis,
onScanStarted,
}
await scanView.attach("<your user identifier>", verify, document.getElementById('attach-here'), viewOptions)
Getting the Scan Result server side
To get the results of a scan on your back-end server, you can make a request to the Scan API