Wrapper of the IDVC library for DVS Online.
npm install brians-onboarding
$ npm install @idscan/onboarding
`
This component contains JS, CSS files which require the mandatory import into your project.
1. Before importing it is necessary to set the webpack-configuration.
Note: The project must use the webpack 4 and later versions.
1.1. Add the following rules of loading to the field rules
`javascript
{
test: /\.css$/,
use: ["style-loader", "css-loader"]
}
`
1.2. If you prefer to use neural networks from your domain, you should add the 'CopyWebpackPlugin' into the section 'plugins' which will copy the files, which are necessary for the work of the neural network, from the folder to another folder that should be selected by you.
*Note: The structure inside the folder of the component 'networks' must be saved on the server with due regard to the nesting.
There are binary files in the folder which do not have the extension. These files must be provided by the server with the header Content-Type: application/octet-stream.*
`javascript
new CopyWebpackPlugin ([
{
from: 'node_modules/@idscan/onboarding/dist/networks/*/',
to: ${networkUrl}/[folder]/[name].[ext],
toType: 'template'
}
])
`
1.3. Import the library and css to your project.
`javascript
import DVSOIDVC from '@idscan/onboarding';
import '@idscan/onboarding/dist/css/onboarding.css';
`
Initialization
Create an instance of the object 'DVS Online IDVC library wrapper'. The object takes one object of the component configuration as a parameter.
All configurations of @idscan/IDVC will be fetched from DVS Online by domainId.
Available fields:
el (string) - Id of an element on the page where the component will be integrated. Required.
applicantId (string) - Id of applicant. Required.
domainId (string) - Domain id where from will get configs and styles. Required.
domainApi (string) - URL address of onboarding API. Required.
publicKey (string) - DVS Web API Public Key. Required.
isAuth (boolean) - Flag indicating that only face authentication is required.
faceOnly (boolean) - Flag indicating that only face registration is required.
chunkPublicPath (string) - Path to the folder with chunks. Specify the path on the server if you need to remove the folder to another location. The default path is \'networks\'.
networkUrl (string) - Path to the folder with neural networks. Specify the path on the server if you need to remove the folder to another location. The default path is \'networks\'.'
useCDN (boolean) - Flag indicating that you want to load networks from cdn instead of your domain.
preferApiConfig (boolean) - Flag indicating that you prefer to use IDVC library configuration, that was sent from the DVS Online API, instead of the configuration used when initializing the wrapper.
hideDocumentTitle (boolean) - This option switches on/off the displaying document titles.
processingImageFormat (string) - This option switches image format, that used for image processing.
demoMode (boolean) - In true mode, the wrapper stops documents validation.
wrapperSettings (object) - Object with wrapper (not IDVC) settings. Allows you to override the config that came from the API. Available fields:
- showQrCode - Enable validation on another device using a QR link.
- showConsentForm - This option switches on/off the displaying consent form.
- consentText - This option allows you to set the body text of the consent form.
- checkboxText - This option allows you to set the confirmation text of the consent form.
callbacks (object) - Object with callback hooks. Available hooks:
- onChange - Callback-function which will be called after change one step. The returnable value is the object with the type and the image.
- onCameraError - Callback-function which is invoked in case if the camera is not available. The response value is the object with the error code and the message.
- onReset - Callback-function which will be called after reset all the steps. The returnable value is the object with the steps.
- onRetakeHook - Callback-function which will be called before reset the current step. The returnable value is the object with the current step.
- onValidate - Callback-function which will be called after validation response received. The returnable value is the object with validation information.
- onError - Callback-function which will be called on error. The response value is the object with the error code and the message.
- onReloaded - Callback-function which will be called after the component finishes reloading. This function doesn't return a value.
- onMounted - Callback-function which will be called on the component mounted. This function doesn't return a value.
- submit - Callback-function which will be called after completing all the steps. The returnable value is the object with the following content:
`javascript
documentTypes: [
{
type: "ID",
steps:[
{ type: 'front', name: 'Document Front', mode: { uploader: true, video: true } },
{ type: 'pdf', name: 'Document PDF417 Barcode' , mode: { uploader: true, video: true } },
{ type: 'face', name: 'Face', mode: { uploader: false, video: true } }
]},
{
type: "Passport",
steps:[
{ type: 'mrz', name: 'Passport Front' , mode: { uploader: true, video: true } },
{ type: 'face', name: 'Face', mode: { uploader: false, video: true } }
]},
]
`
steps – steps with the type and the image in the format 'base64'.
Also, if you use automatic capture, in the "back" step trackstring will be returned (raw PDF417 data from Barcode encoded in base64)
*Note: Request an license key for the library by emailing
sales@idscan.net or support@idscan.net*
Methods
setApplicant (string) - the method that reinitialize wrapper for new applicant. Parameter is an applicant id of string type.
`javascript
import DVSOIDVC from './Wrapper';
const lib = new DVSOIDVC({
applicantId: '...',
domainId: '...',
publicKey: '...',
chunkPublicPath: '/customPath/',
domainApi: '...',
});
const btn = document.getElementById('btn');
btn.addEventListener('click', () => {
const applicantId = 'new applicant id';
lib.setApplicant(applicantId);
});
``