youverify-web-sdk

2.1.4 • Public • Published

Youverify Web SDK

Browser wrapper for Youverify's vForm

Table of Contents

Features

Installation

Using npm:

$ npm install youverify-web-sdk

Using yarn:

$ yarn add youverify-web-sdk

Using CDN:

Modules

vForm

The vForm module is available for integration to your web app if you wish to use vForm

Usage

Initialization:

  1. To use the vForm module in your project, you have to first pass your custom options to it like so:
const vFormModule = new YouverifySDK.vForm(options)

Checkout a list of the valid options for the vForm module

Example:

const vFormModule = new YouverifySDK.vForm({
	vFormId: `Id of vForm`,
	publicMerchantKey: `<YOUR PUBLIC MERCHANT KEY>`,
	sandboxEnvironment: false, // true if environment is in sandbox mode. Default to false
	personalInformation: {
		firstName: "John",
		lastName: "Doe",
		middleName: "Bruno", // optional
		email: "john@doe.co", // optional
		mobile: "+2348*********", // optional
		gender: "MALE", // optional [MALE, FEMALE]
	},

	//Customize your form using prefered greeting texts and colours(This is Optional)
	appearance: {
		greeting:
			"We will need to verify your identity. It will only take a moment.",
		actionText: "Verify Identity",
		buttonBackgroundColor: "#46B2C8",
		buttonTextColor: "#fffff",
		primaryColor: "#46B2C8",
	},

	metadata: {},

	onSuccess: () => {
		// vForm has submitted successfully
	},

	onClose: () => {
		// close button was clicked
	},
});
  1. Call initialize on the vFormModule object
try {
	vFormModule.initialize();
} catch (error) {
	// handle validation error
}

Start Process

  1. Call start() on the vFormModule object to show the pop-up modal and start the process.
vFormModule.start();

vForm Options

These are the valid options to pass to the vFormModule instance

{
  // `vFormId` is the Id of the vForm you would like the SDK to open
  "vFormId": "<YOUR-VFORM-ID>", // required

  // `publicMerchantKey` is available in your YVOS profile
  "publicMerchantKey": "<YOUR-PUBLIC-MERCHANT-KEY>", // required

  // `personalInformation` is an object containing a list of predefined user attributes to be passed to the SDK for personalization of the experience. Attributes passed here should typically exist in the vForm created, else, they will be ignored.
  "personalInformation": {
    "firstName": "John", // optional
    "lastName": "Doe", // optional
    "middleName": "Bruno", // optional
    "email": "john@doe.co", // optional
    "mobile": "+2348*********", // optional
    "gender": "MALE", // optional [MALE, FEMALE]
  },

  //Customize your form using prefered greeting texts and colours(This is Optional)
  appearance:{
    greeting:'We will need to verify your identity. It will only take a moment.',
         actionText:'Verify Identity',
         buttonBackgroundColor:'#46B2C8',
         buttonTextColor:'#fffff',
         primaryColor:'#46B2C8'
  },

  // `metadata` is any other information you would like to pass to your webhook URL
  "metadata": { // optional
    // your custom keys
  },

  // `onSuccess` callback is a function called onced the vForm entry has been submitted successfully
  "onSuccess": (data) => { // optional
    // custom logic here
  }

  // `onClose` callback is a function called onced the vForm process has been cancelled or modal closed
  "onClose": () => { // optional
    // custom logic here
  }
}

Note: Once the vForm process is completed and successfull, the onSuccess callback supplied will be triggered. If none was supplied, nothing happens.

Liveness Check

The Liveness Check module is available for integration to your web app if you wish to allow your users perform liveness checks.

Usage

Initialization:

  1. To use the liveness module in your project, you have to first pass your custom options to it like so:
const livenessCheckModule = new YouverifySDK.liveness(options)

Checkout a list of the valid options for the liveness check module

Example:

const livenessCheckModule = new YouverifySDK.liveness({
	publicMerchantKey: `<YOUR PUBLIC MERCHANT KEY>`,
	sandboxEnvironment: false, // true if environment is in sandbox mode. Default to false
	personalInformation: {
		firstName: "John",
		lastName: "Doe",
	},
	//Customize your form using prefered greeting texts and colours(This is Optional)
	appearance: {
		greeting:
			"We will need to perform a liveness test. It will only take a moment.",
		actionText: "Perform liveness test",
		buttonBackgroundColor: "#46B2C8",
		buttonTextColor: "#fffff",
		primaryColor: "#46B2C8",
	},

	onSuccess: () => {
		// liveness check was successful
	},
	onFailure: () => {
		// liveness check was not successful
	},
	// `onClose` callback is a function called onced the liveness check process modal has been closed
	onClose: () => {
		// optional
		// custom logic here
	},
});
  1. Call initialize on the livenessCheckModule object
try {
	livenessCheckModule.initialize();
} catch (error) {
	// handle validation error
}

Start Process

  1. Call start() on the livenessCheckModule object to show the pop-up modal and start the process.
livenessCheckModule.start();

Liveness Check Options

These are the valid options to pass to the livenessCheckModule instance

{
  // `publicMerchantKey` is available in your YVOS profile
  "publicMerchantKey": "<YOUR-PUBLIC-MERCHANT-KEY>", // required
  sandboxEnvironment: false,  // true if environment is in sandbox mode. Default to false
  // `personalInformation` is an object containing a list of predefined user attributes to be passed to the SDK for personalization of the experience
  "personalInformation": {
    "firstName": "John", // optional
    "lastName": "Doe", // optional
  },
  //Customize your form using prefered greeting texts and colours(This is Optional)
  appearance:{
    greeting:'We will need to perform a liveness test. It will only take a moment.',
       actionText:'Perform Liveness Test',
       buttonBackgroundColor:'#46B2C8',
       buttonTextColor:'#fffff',
       primaryColor:'#46B2C8'
  },
  // `metadata` is any other information you would like to pass to your webhook URL
  "metadata": { // optional
    // your custom keys
  },

  // `onCompleted` callback is a function called onced the liveness check was successful
  "onSuccess": () => { // optional
    // custom logic here
  }

  // `onFailure` callback is a function called onced the liveness check fails
  "onFailure": (error) => { // optional
    // custom logic here
  }

  // `onClose` callback is a function called onced the liveness check process modal has been closed
  "onClose": () => { // optional
    // custom logic here
  }
}

Note: Once the liveness process is completed and successfull, the onSuccess callback supplied will be triggered. If none was supplied, nothing happens.

Document Capture

The Document Capture module is available for integration to your web app if you wish to allow your users carry out identity documents capture.

Usage

Initialization:

  1. To use the document capture module in your project, you have to first pass your custom options to it like so:
const documentCaptureModule = new YouverifySDK.documentCapture(options)

Checkout a list of the valid options for the document capture module

Example:

const documentCaptureModule = new YouverifySDK.documentCapture({
	publicMerchantKey: `<YOUR PUBLIC MERCHANT KEY>`,

	personalInformation: {
		firstName: "John",
	},
	//Customize your form using prefered greeting texts and colours(This is Optional)
	appearance: {
		greeting:
			"We will need to capture your document. It will only take a moment.",
		actionText: "Capture Document",
		buttonBackgroundColor: "#46B2C8",
		buttonTextColor: "#fffff",
		primaryColor: "#46B2C8",
	},

	countries: [
		{
			//pass country code you want the document to be capture for. (optional)
			countryCode: "ng",

			//list of document types you want in the country. (optional)
			idTypes: ["passport", "Residence Permit", "Driving License", "NIN"],
			// pass the province in the country you entered above. (optional) leave blank if country does not have a province
			province: ["Alberta"],
		},
		{
			countryCode: "CA",
			idTypes: [
				"passport",
				"Residence Permit",
				"Driving License",
				"Driver License/Public Services Card (Combined)",
				" Citizenship   Certificate ",
				"nin",
			],
			province: [" Alberta ", "Quebec"],
		},
	],

	//for list of supported countries,province and document types see above

	onSuccess: () => {
		// result received from document
	},
	onFailure: () => {
		// could not get result from document
	},
	onClose: () => {
		// optional
		// custom logic here
	},
});
  1. Call initialize on the documentCaptureModule object
try {
	documentCaptureModule.initialize();
} catch (error) {
	// handle validation error
}

Start Process

  1. Call start() on the documentCaptureModule object to show the pop-up modal and start the process.
documentCaptureModule.start();

Document Capture Options

These are the valid options to pass to the documentCaptureModule instance

{
  // `publicMerchantKey` is available in your YVOS profile
  "publicMerchantKey": "<YOUR-PUBLIC-MERCHANT-KEY>", // required

   // true if environment is in development mode. Default to false
   sandboxEnvironment: true,

  // `personalInformation` is an object containing a list of predefined user attributes to be passed to the SDK for personalization of the experience
  "personalInformation": {
    "firstName": "John", // optional
  },
  //Customize your form using prefered greeting texts and colours(This is Optional)
  appearance:{
    greeting:'We will need to capture your document. It will only take a moment.',
            actionText:'Capture Document',
            buttonBackgroundColor:'#46B2C8',
            buttonTextColor:'#fffff',
            primaryColor:'#46B2C8'
  },
countries[
  {
    //pass country code you want the document to be capture for. (optional)
    countryCode:'ng',

            //list of document types you want in the country. (optional)
    idTypes:[
    "passport",
    "Residence Permit",
    "Driving Licence",

    "NIN"
  ],
          // pass the province in the country you entered above. (optional) leave blank if country does not have a province
    province:['Alberta'],
  },
  {
    countryCode:'CA',
    idTypes:[
    "passport",
    "Residence Permit",
    "Driving License",
    "Driver License/Public Services Card (Combined)",
    " Citizenship   Certificate ",
    'nin',

  ],
   province:[' Alberta ','Quebec'],
  }
]
  // `metadata` is any other information you would like to pass to your webhook URL
  "metadata": { // optional
    // your custom keys
  },

  // `onSuccess` callback is a function called onced the document capture has a result
  "onSuccess": (data) => { // optional
    // data will contain the following
    /* {
      documentNumber: "xyz",
      firstName: "John",
      lastName: "Doe",
      fullName: "John Doe",
      dateOfBirth: "29-01-2022",
      dateOfExpiry: "29-01-2022",
      gender: "M",
      rawMRZString: "*****...",
      fullDocumentFrontImage: "", // base64 image of the document's front
      fullDocumentBackImage: "", // base64 image of the document's back
      fullDocumentImage: "", // base64 image of the document's front. Exists when there's no back image to be captured
    }*/
    // custom logic here
  }

  "onFailure": (error) => {
    console.log(error);
  },

  // `onClose` callback is a function called onced the document capture modal has been closed
  "onClose": () => { // optional
    // custom logic here
  }
}

Note: Once the document capture process is completed and successfull, the onSuccess callback supplied will be triggered. If none was supplied, nothing happens.

Supported Countries for document capture:

//The table below is the list of countries, document types and provinces if available

Contries States/Provinces Document Types
Alfghanistan(--) - [Id Card, Passport]
Albania(AL) - [Drivers License,Driver Card,
Id Card, Professional DL, Passport]
Algeria(DZ) - [Id Card, passport, Drivers License]
Armenia(AM) - [Id Card, passport, Drivers License]
Antigua & Barbuda - Drivers License
Argentina(AR) - [Alien Id, Id Card, passport,
Drivers License]
Australia(AU) - Passport
Australia(AU) New South Wales [Drivers License, Id Card, Passport]
Australia(AU) South Australia, [Drivers License, Passport,
Northern Territory, Proof of Age Card]
Queensland
Australia(AU) Tasmania, Victoria, [Drivers License, Passport]
Western Australia, Queensland,
Australian Capital Territory
Austria(AT) - [Passport, Id Card, Passport,
- Residence Permit]
Azerbaijan(AZ) - [Passport, Id Card]
Bahamas(BS) - [Id Card, Drivers License]
Bahrain(BH) - Id Card
Bangladesh(BD) - [Id Card, passport, Drivers License]
Belarus(BY) - [Passport, Drivers License]
Belgium(BE) - [Passport, Id Card, Passport,
- Residence Permit,Resident Id,
Drivers License, Minors Id]
Bermuda(BM) - Drivers License
Bolivia(BO) - [Drivers License, Minors Id,Id Card]
Bosnia & Herzegovina(BA) - [Id Card, passport, Drivers License]
Botswana(BW) - Id Card
Brazil(BR) Sao Paolo [Id Card, passport, Drivers License,
- Consular Passport, Military Id,
- Residence Permit, Temporary Residence
Permit]
Brazil(BR) [Id Card, passport, Drivers License,
- Consular Passport, Military Id,
- Residence Permit, Temporary Residence
Permit]
Brunei(BN) - [Id Card, Drivers License,
- Military Id, Residence Permit
- Temporary Residence Permit]
Bulgaria(BG) - [Id Card, passport, Drivers License]
Burkina Faso(BF) - Drivers License
Cambodia(KH) - [Id Card, passport, Drivers License]
Cameroon(CM) - Id Card
Canada(CA) - [Passport, Residence Permit,
- Social Security Card, Tribal Id,
- Weapon Permit, Citizenship Certificate ]
Canada(CA) British Columbia [Passport, Residence Permit,
Social Security Card, Tribal Id,
Weapon Permit, Drivers License,
Id Card, Citizenship Certificate,
Minors Public Services Card,
Public Services Card]
Canada(CA) Manitoba, Alberta, Ontario [Passport, Residence Permit,
Nova Scotia, Saskatchewan Social Security Card, Tribal Id,
Weapon Permit, Drivers License,
Id Card, Citizenship Certificate ]
Canada(CA) New Brunswick, Quebec, [Passport, Residence Permit,
Newfoundland & Labradon, Social Security Card, Tribal Id,
Yukon Weapon Permit, Drivers License,
Citizenship Certificate ]
Chile(CL) - [Id Card, Drivers License,
- Passport, Alien Id]
China(CN) - [Drivers License, Id Card]
Colombia(CO) - [Drivers License, Id Card, Passport
- Minors Id, Aliens Id]
Costa Rica(CR) - [Drivers License, Id Card]
Croatia(HR) - [Id Card, passport, Drivers License
- Residence Permit]
Cuba(--) - Passport
Cyprus(CY) - [Id Card, passport, Drivers License
- Residence Permit]
Czechia(CZ) - [Id Card, Passport, Drivers License
- Residence Permit]
Democratic Republic Of The Congo(CD) - Drivers License
Denmark(DK) : - [Passport, Drivers License
- Residence Permit]
Dominican Republic(DO) - [Id Card, Passport, Drivers License]
Ecuador(EC) - [Drivers License, Id Card]
Egypt(EG) - [Id Card, Passport, Drivers License]
El Salvador(SV) - [Id Card, Drivers License]
Estonia(EE) - [Id Card, Passport, Drivers License
- Residence Permit]
Eswatini(SZ) - Passport
Finland(FI) - [Drivers License, Id Card, Passport
- Residence Permit, Aliens Id]
France(FR) - [Id Card, Passport, Drivers License
- Residence Permit]
Georgia(GE) - [Id Card, Passport, Drivers License]
Germany(DE) - [Id Card, Passport, Drivers License
- Residence Permit, Minors Passport]
Ghana(GH) - [Id Card, Passport, Drivers License]
Greece(GR) - [Id Card, Passport, Drivers License
- Residence Permit]
Guatemala(GT) - [Id Card, Passport, Drivers License,
- Consular Id]
Haiti(HT) - [Id Card, Passport, Drivers License]
Honduras(HN) - [Id Card, Passport, Drivers License]
Hong Kong(HK) - [Id Card, Passport]
Hungary(HU) - [Id Card, Passport, Drivers License
- Residence Permit, Address Card]
Iceland(IS) - [Passport, Drivers License]
India(IN) - [Pan Card, Id Card, Passport,
- Voter Id]
India(IN) Gujarat, Karnataka, Punjab [Pan Card, Id Card, Passport,
Madhya Pradesh, Maharashtra Voter Id, Drivers License]
Kerala, Tamil Nadu
Indonesia(ID) - [Id Card, Passport, Drivers License]
Iran(IR) - Passport
Iraq(IQ) - [Passport, Id Card]
Ireland(IE) - [Passport Card, Drivers License
- Public Services Card , Passport]
Israel(IL) - [Id Card, Passport, Drivers License]
Italy(IT) - [Id Card, Passport, Drivers License
- Residence Permit]
Ivory Coast(CI) - [ Id Card , Drivers License]
Jamaica(JM) - Drivers License
Japan(JP) - [My Number Card, Passport, Drivers
- License]
Jordan(JO) - [Id Card, Passport, Drivers License]
Kazakhstan(KZ) - Id Card
Kenya(KE) - [ Id Card, Passport]
Kosovo(XK) - [Id Card, Passport, Drivers License]
Kuwait(KW) - [Id Card, Drivers License, Residence
- Permit]
Kyrgyzstan(KG) - Id Card
Latvia(LV) - [Passport, Id Card, Alien Id
- Residence Permit, Alien Passport,
Drivers License]
Lebanon(LB) - Id Card
Libya(LY) - Passport
Lithuania(LT) - [Id Card, Passport, Drivers License]
Luxembourg(LU) - [Id Card, Drivers License, Residence
- Permit]
Malaysia(MY) - [My KAS,MyKad, Drivers License,
- MyKid, MyPolis, MyTentera, i-Kad
- Refugee ID, Passport, MyPR]
Maldives(MV) - Id Card
Malta(MT) - [Id Card, Drivers License, Residence
- Permit]
Mauritius(MU) - Id Card
Mexico(MX) - [Consular Id, Professional DL,
- Professional ID, Voter Id, Passport,
- Resident Permit]
Mexico(MX) Baja California Sur, Campeche [Consular Id, Professional DL,
Baja California, Chiapas, Professional ID, Voter Id, Passport,
Chihuahua, Ciudad de Mexico, Resident Permit, Drivers License]
Coahuila, Colima, Durango,
Guanajuato, Guerrero-Cocula,
Guerrero-Juchitan, Hidalgo,
Jalisco, Mexico, Michoacan,
Michoacan, Morelos, Nayarit,
Nuevo Leon, Oaxaca, Puebla,
Quintana Roo-Cozumel, Yucatan,
Quintana Roo-Solidaridad,
San Luis Potosi, Sonora,
Sinaloa, Tabasco, Tamaulipas,
Tlaxcala, Veracruz, Zacatecas
Moldova(MD) - [Passport, Id Card]
Montenegro(ME) - [Id Card, Passport, Drivers License]
Morocco(MA) - [Id Card, Passport, Drivers License]
Mozambique(MZ) - Drivers License
Myanmar(MM) - Drivers License
Nepal(NP) - Passport
Netherlands(NL) - [Id Card, Passport, Drivers License
- Residence Permit]
New Zealand(NZ) - [Passport, Drivers License]
Nicaragua(NI) - Id Card
Nigeria(NG) - [Id Card, Passport, Drivers License
- Voter Id]
North Macedonia(MK) - [Id Card, Passport, Drivers License]
Norway(NO) - [Passport, Drivers License,
- Residence Permit]
Oman(OM) - [Id Card, Resident Id, Drivers License]
Pakistan(PK) - [Passport, Consular Id, Id Card]
Pakistan(PK) Punjab [Passport, Consular Id, Id Card,
- Drivers License]
Panama(PA) - [Id Card, Drivers License,
- Residence Permit,
- Temporary Residence Permit]
Paraguay(PY) - [Id Card, Drivers License]
Peru(PE) - [Id Card, Passport, Drivers License
- Minors Id]
Philippines(PH) - [Id Card, Drivers License, Passport
- Residence Permit, Tax Id, Voter Id,
- Social Security Card, Professional
- Id, Multipurpose Id]
Poland(PL) - [Id Card, Passport, Drivers License
- Residence Permit]
Portugal(PT) - [Id Card, Passport, Drivers License
- Residence Permit]
Puerto Rico(PR) - [Drivers License, Voter Id]
Qatar(QA) - [Id Card, Passport, Drivers License
- Residence Permit]
Romania(RO) - [Id Card, Passport, Drivers License]
Russia(RU) - [Passport, Drivers License]
Rwanda(RW) - Id Card
Saudi Arabia(SA) - [Id Card, Passport, Drivers License
- Residence Id]
Senegal(SN) - Id Card
Serbia(RS) - [Id Card, Passport, Drivers License]
Singapore(SG) - [Id Card, Drivers License, Passport
- Residence Id, Employment Pass,
- Fin Card , S Pass, Work Permit]
Slovakia(SK) - [Id Card, Passport, Drivers License
- Residence Id]
Slovenia(SI) - [Id Card, Passport, Drivers License
- Residence Permit]
South Africa(ZA) - [Id Card, Passport, Drivers License]
South Korea(KR) - [Id Card, Passport, Drivers License]
Spain(ES) - [Id Card, Passport, Drivers License
- Residence Permit, Alien Id]
Sri Lanka(LK) - [Id Card, Passport, Drivers License]
Sudan(SD) - Passport
Sweden(SE) - [Id Card, Passport, Drivers License
- Residence Permit,Social Security Card ]
Switzerland(CH) - [Id Card, Passport, Drivers License,
- Residence Permit]
Syria(SY) - Passport
Taiwan(TW) - [Passport,
- Temporary Residence Permit]
Tajikistan(TJ) - Passport
Tanzania(TZ) - [Id Card, Voter Id, Drivers License]
Thailand(TH) - [Id Card, Passport, Drivers License
- Alien ID]
Trinidad And Tobago(TT) - [Id Card, Drivers License]
Tunisia(TN) - [Id Card, Passport, Drivers License]
Turkey(TR) - [Id Card, Passport, Drivers License,
- Residence Permit]
UAE(AE) - [Id Card, Passport, Drivers License,
- Residence Id]
Uganda(UG) - [Id Card, Drivers License]
UK(GB) - [Id Card, Passport, Residence Id,
- Proof Of Age Card]
Ukraine(UA) - [Id Card, Drivers License, Passport
- Residence Permit,
- Temporary Residence Permit]
Uruguay(UG) - [Id Card]
USA(US) - [Border Crossing Card,Global Entry
Card,Green Card, Military ID, Nexus
Card, Passport Card, Passport,
Social Security Card, Veteran ID,
Work Permit]
USA(US) Delaware, Louisiana, [Border Crossing Card,Global Entry
New Hampshire, South Dakota , Card,Green Card, Military ID, Nexus
West Virginia, Wyoming Card, Passport Card, Passport,
Social Security Card, Veteran ID,
Work Permit, Drivers License]
USA(US) District Of Columbia, Florida, [Border Crossing Card,Global Entry
Georgia, Hawaii, Idaho, Iowa Card,Green Card, Military ID, Nexus
Illinois, Indiana, Kansas Card, Passport Card, Passport,
Kentucky, Maine, Maryland Social Security Card, Veteran ID,
Massachusetts, Michigan Work Permit, Drivers Lincense,
Minnesota, Mississippi, Utah Id Card]
Missouri, Montana, Nebraska
Nevada,New Jersey, New Mexico,
New York, North Carolina, Ohio
Oklahoma, Oregon, Pennsylvania
Rhode Island, South Carolina,
Tennessee, Vermont, Virginia,
Washington, Wisconsin, Alabama
Alaska, Arizona, Arkansas,
California, Colorado,
Connecticut
USA(US) New York City [Border Crossing Card,Global Entry
Card,Green Card, Military ID, Nexus
Card, Passport Card, Passport,
Social Security Card, Veteran ID,
Work Permit, Id Card]
USA(US) Texas [Border Crossing Card,Global Entry
Card,Green Card, Military ID, Nexus
Card, Passport Card, Passport,
Social Security Card, Veteran ID,
Work Permit, Drivers License,
Id Card, Weapon Permit]
Uzbekistan(UZ) - [Drivers License, Passport]
Venezuela(VE) - [Drivers License, Passport, Id Card]
Vietnam(VN) - [Drivers License, Id Card]
Zimbabwe(ZW) - Passport

CloseSDKModal:

Method Name Parameters Returns Description
setShowModal Boolean Null This methods allows you to close the SDK modal via code.

Credits

This SDK is developed and maintained solely by Youverify

License

MIT License

Package Sidebar

Install

npm i youverify-web-sdk

Weekly Downloads

1,786

Version

2.1.4

License

MIT

Unpacked Size

66.2 kB

Total Files

3

Last publish

Collaborators

  • youverify-hq