uqudo
HomeCustomer PortalBook a Demo
  • KYC
    • Getting Started
      • Use Cases
        • User Enrolment
        • Face Authentication
      • Integration Options
        • Uqudo SDK
        • Uqudo API
        • No-code KYC
      • Customer Portal
        • Manage your SDK/API credentials
        • Create a new secret
        • Create a support request
    • Uqudo SDK
      • Integration
        • Android
          • Prepare Environment
          • Enrolment Flow
          • Lookup Flow
          • Face Session Flow
          • UI Customisation
            • UX & Branding
            • Dark / Night mode
            • Text & Language
              • General Strings
              • Scanning
              • Reading
              • Face Recognition
              • Background Check
              • Lookup
          • Analytics
        • iOS
          • Prepare Environment
          • Usage
          • Enrolment Flow
          • Lookup Flow
          • Face Session Flow
          • UI Customisation
            • UX & Branding
            • Dark / Night mode
            • Text & Language
          • Analytics
        • Web
          • SDK installation
            • Vanilla HTML+JS project
            • JS Frameworks (React, Angular, VueJs, etc...)
          • SDK Initialisation
          • CORS
          • Enrolment Flow
          • Face Session Flow
          • Javascript Usage
          • Typescript Usage
          • Operation Error
          • UI Customisation
            • Styles Configuration
            • Text & Language
            • Assets & Images
          • Webview Usage
          • Analytics
        • Capacitor
          • Plugin Installation
          • Enrolment Flow
          • Lookup Flow
          • Face Session Flow
        • Cordova
          • Plugin Installation
          • Enrolment Flow
          • Lookup Flow
          • Face Session Flow
        • Flutter
          • Plugin Installation
          • Enrolment Flow
          • Lookup Flow
          • Face Session Flow
        • React Native
          • Plugin Installation
          • Enrolment Flow
          • Lookup Flow
          • Face Session Flow
        • Xamarin and .NET
          • Plugin Installation
          • Enrolment Flow
          • Lookup Flow
          • Face Session Flow
          • Analytics
      • SDK result
        • Validation and Parsing
        • Data Structure
          • Common Object
          • Scan Object
          • Reading Object
            • Algerian ID
            • Bahrain ID
            • Ghana ID
            • Iraqi ID
            • Netherlands DL
            • Oman ID
            • Moroccan ID
            • Qatar ID
            • Saudi ID
            • Senegal ID
            • Turkish ID
            • UAE ID
            • Passports
          • Face Object
          • Lookup Object
            • Ghana SSNIT
            • Ghana Voter ID
            • Ghana Passport
            • Ghana Driving Licence
            • India PAN card
            • India Aadhaar ID
            • Nigeria Voter ID
            • Nigeria Driving Licence
            • Nigeria NIN
            • Nigeria BVN
            • Kenya National ID
            • South Africa ID
            • Uganda Voter ID
            • UAE Emirates ID
          • Verification Object
        • Download a Resource
        • Encrypt the SDK result
        • Security & Best Practices
      • Upgrade the SDK
      • Changelog
        • Mobile SDK
        • Web SDK
    • Uqudo API
      • Authorisation API
      • Scan API
        • Passports
          • AUS (Australia)
          • BEL (Belgium)
          • BHR (Bahrain)
          • CAN (Canada)
          • CHE (Switzerland)
          • DEU (Germany)
          • EGY (Egypt)
          • FRA (France)
          • GBR (UK)
          • IND (India)
          • JOR (Jordan)
          • KWT (Kuwait)
          • LBN (Lebanon)
          • MAR (Morocco)
          • OMN (Oman)
          • PAK (Pakistan)
          • PHL (Philippines)
          • PSE (Palestine)
          • QAT (Qatar)
          • SAU (Saudi Arabia)
          • SDN (Sudan)
          • SYR (Syria)
          • TUN (Tunisia)
          • TUR (Turkey)
          • UAE (UAE)
          • USA (USA)
          • YEM (Yemen)
          • ZAF (South Africa)
        • Generic National IDs
        • Country Specific IDs
          • BHR_DL (Bahrain Driving Licence)
          • BHR_ID (Bahrain ID)
          • BHR_VL (Bahrain Vehicle License)
          • COD_DL (DRC Driving Licence)
          • COD_VOTER_ID (DRC Voter ID)
          • DZA_ID (Algerian ID)
          • EGY_ID (Egypt ID)
          • GBR DL (UK Driving License)
          • GBR_ID (UK Resident ID)
          • GHA_DL (Ghana Driving Licence)
          • GHA_ID (Ghana National ID)
          • GHA_SSNIT (Ghana Social Security and National Insurance Trust)
          • GHA_VOTER_ID (Ghana Voter ID)
          • IND_ID (India Identity Card)
          • IND_PAN (Indian PAN Card)
          • IRQ_ID (Iraqi ID)
          • JOR_VL (Jordan Vehicle License)
          • KEN_ID (Kenya ID)
          • KWT_ID (Kuwait ID)
          • LBN DL (Lebanese Driving Licence)
          • LBN_ID (Lebanese ID)
          • MAR_ID (Moroccan ID)
          • NGA_DL (Nigeria Driving Licence)
          • NGA_NIN (Nigeria Digital NIN)
          • NGA_VOTER_ID (Nigeria Voter Card)
          • NLD_DL (Netherlands Driving Licence)
          • OMN_DL (Oman Driving Licence)
          • OMN_ID (Oman ID)
          • OMN_VL (Oman Vehicle License)
          • PAK_ID (Pakistan ID)
          • PHL_DL (Philippines Driving License)
          • QAT_DL (Qatar Driving Licence)
          • QAT_ID (Qatar ID)
          • RSL_ID (Somaliland National ID)
          • RWA_ID (Rwanda ID)
          • SAU_DL (Saudi Arabia Driving Licence)
          • SAU_ID (Saudi Arabia ID)
          • SAU_VL (Saudi Vehicle License)
          • SDN_DL (Sudan Driving Licence)
          • SDN_ID (Sudan ID)
          • SDN_VL (Sudan Vehicle License)
          • SEN_ID (Senegal ID)
          • SOM_ID (Somali ID)
          • TUN_ID (Tunisian ID)
          • TUR_ID (Turkish ID)
          • UAE_DL (UAE Driving Licence)
          • UAE_ID (UAE Emirates ID)
          • UAE_ID_DIGITAL (UAE Emirates ID digital version)
          • UAE_VISA (UAE Visa)
          • UAE_VL (UAE Vehicle Licence)
          • UAE_EVISA (UAE e-visa)
          • UAE_ID_APPLICATION_FORM (UAE ID application form)
          • UAE_PASSPORT_DIGITAL (Digital Emirates Passport)
          • UGA_ID (Uganda ID)
          • UGA_VOTER_ID (Uganda Voter ID)
          • USA_DL (USA Driving Licence)
          • ZAF_DL (South Africa Driving License)
          • ZAF_ID (South Africa ID)
        • MRZ only (TD1 or TD3)
      • Info API
      • Face API
      • Lookup API
        • Ghana
        • India
        • Kenya
        • Nigeria
        • South Africa
        • Uganda
        • UAE
      • Background Check API
    • No-code KYC
      • Workflow Settings
      • Text Settings
      • Other Settings
      • Onboard Users
  • KYB
    • Getting Started
      • Use Cases
        • Low-complexity
        • Medium-complexity
        • High-complexity
      • Integration Options
        • Uqudo API
    • Uqudo API
      • Company API
      • Screening API
      • Data Matching API
      • Session API
  • Coverage
    • Middle East
      • 🇧🇭Bahrain
      • 🇮🇷Iran
      • 🇮🇶Iraq
      • 🇮🇱Israel
      • 🇯🇴Jordan
      • 🇰🇼Kuwait
      • 🇱🇧Lebanon
      • 🇴🇲Oman
      • 🇵🇸Palestine
      • 🇶🇦Qatar
      • 🇸🇦Saudi Arabia
      • 🇸🇾Syria
      • 🇹🇷Turkey
      • 🇦🇪United Arab Emirates
      • 🇾🇪Yemen
    • Africa
      • 🇩🇿Algeria
      • 🇦🇴Angola
      • 🇧🇯Benin
      • 🇧🇼Botswana
      • 🇧🇫Burkina Faso
      • 🇧🇮Burundi
      • 🇨🇲Cameroon
      • 🇨🇻Cape Verde
      • 🇨🇫Central African Republic
      • 🇹🇩Chad
      • 🇰🇲Comoros
      • 🇨🇩Democratic Republic of Congo
      • 🇩🇯Djibouti
      • 🇪🇬Egypt
      • 🇬🇶Equatorial Guinea
      • 🇪🇷Eritrea
      • 🇸🇿Eswatini
      • 🇪🇹Ethiopia
      • 🇬🇦Gabon
      • 🇬🇲Gambia
      • 🇬🇭Ghana
      • 🇬🇳Guinea
      • 🇬🇼Guinea-Bissau
      • 🇨🇮Ivory Coast
      • 🇰🇪Kenya
      • 🇱🇸Lesotho
      • 🇱🇷Liberia
      • 🇱🇾Libya
      • 🇲🇬Madagascar
      • 🇲🇼Malawi
      • 🇲🇱Mali
      • 🇲🇷Mauritania
      • 🇲🇺Mauritius
      • 🇲🇦Morocco
      • 🇲🇿Mozambique
      • 🇳🇦Namibia
      • 🇳🇪Niger
      • 🇳🇬Nigeria
      • 🇨🇩Republic of Congo
      • 🇷🇼Rwanda
      • 🇸🇹Sao Tome and Principe
      • 🇸🇳Senegal
      • 🇸🇨Seychelles
      • 🇸🇱Sierra Leone
      • 🇸🇴Somalia
      • 🇸🇴Somaliland
      • 🇿🇦South Africa
      • 🇸🇸South Sudan
      • 🇸🇩Sudan
      • 🇹🇿Tanzania
      • 🇹🇬Togo
      • 🇹🇳Tunisia
      • 🇺🇬Uganda
      • 🇿🇲Zambia
      • 🇿🇼Zimbabwe
    • Asia
      • 🇦🇫Afghanistan
      • 🇦🇲Armenia
      • 🇦🇿Azerbaijan
      • 🇧🇩Bangladesh
      • 🇧🇹Bhutan
      • 🇧🇳Brunei
      • 🇰🇭Cambodia
      • 🇨🇳China
      • 🇹🇱East Timor
      • 🇬🇪Georgia
      • 🇭🇰Hong-Kong (China)
      • 🇮🇳India
      • 🇮🇩Indonesia
      • 🇯🇵Japan
      • 🇰🇿Kazakhstan
      • 🇰🇬Kyrgyzstan
      • 🇱🇦Laos
      • 🇲🇴Macau (China)
      • 🇲🇾Malaysia
      • 🇲🇻Maldives
      • 🇲🇳Mongolia
      • 🇲🇲Myanmar
      • 🇳🇵Nepal
      • 🇰🇵North Korea
      • 🇵🇰Pakistan
      • 🇵🇭Philippines
      • 🇸🇬Singapore
      • 🇰🇷South Korea
      • 🇱🇰Sri Lanka
      • 🇹🇼Taiwan (China)
      • 🇹🇯Tajikistan
      • 🇹🇭Thailand
      • 🇹🇲Turkmenistan
      • 🇺🇿Uzbekistan
      • 🇻🇳Vietnam
    • Europe
      • 🇦🇱Albania
      • 🇦🇩Andorra
      • 🇦🇹Austria
      • 🇧🇾Belarus
      • 🇧🇪Belgium
      • 🇧🇦Bosnia and Herzegovina
      • 🇧🇬Bulgaria
      • 🇭🇷Croatia
      • 🇨🇾Cyprus
      • 🇨🇿Czech Republic
      • 🇩🇰Denmark
      • 🇪🇪Estonia
      • 🇫🇴Faroe Islands (Denmark)
      • 🇫🇮Finland
      • 🇫🇷France
      • 🇩🇪Germany
      • 🇬🇮Gibraltar (UK)
      • 🇬🇷Greece
      • 🇬🇱Greenland (Denmark)
      • 🇬🇬Guernsey (UK)
      • 🇭🇺Hungary
      • 🇮🇸Iceland
      • 🇮🇪Ireland
      • 🇮🇲Isle of Man (UK)
      • 🇮🇹Italy
      • 🇯🇪Jersey (UK)
      • 🇽🇰Kosovo
      • 🇱🇻Latvia
      • 🇱🇮Liechtenstein
      • 🇱🇹Lithuania
      • 🇱🇺Luxembourg
      • 🇲🇹Malta
      • 🇲🇩Moldova
      • 🇲🇨Monaco
      • 🇲🇪Montenegro
      • 🇳🇱Netherlands
      • 🇲🇰North Macedonia
      • 🇨🇾Northern Cyprus
      • 🇳🇴Norway
      • 🇵🇱Poland
      • 🇵🇹Portugal
      • 🇷🇴Romania
      • 🇷🇺Russia
      • 🇸🇲San Marino
      • 🇷🇸Serbia
      • 🇸🇰Slovakia
      • 🇸🇮Slovenia
      • 🇪🇸Spain
      • 🇸🇪Sweden
      • 🇨🇭Switzerland
      • 🇺🇦Ukraine
      • 🇬🇧United Kingdom
      • 🇻🇦Vatican City
    • North America
      • 🇦🇮Anguilla (UK)
      • 🇦🇬Antigua and Barbuda
      • 🇧🇸Bahamas
      • 🇧🇧Barbados
      • 🇧🇿Belize
      • 🇧🇲Bermuda (UK)
      • 🇻🇬British Virgin Islands (UK)
      • 🇨🇦Canada
      • 🇰🇾Cayman Islands (UK)
      • 🇨🇷Costa Rica
      • 🇨🇺Cuba
      • 🇩🇲Dominica
      • 🇩🇴Dominican Republic
      • 🇸🇻El Salvador
      • 🇬🇩Grenada
      • 🇬🇹Guatemala
      • 🇭🇹Haiti
      • 🇭🇳Honduras
      • 🇯🇲Jamaica
      • 🇲🇽Mexico
      • 🇲🇸Montserrat (UK)
      • 🇵🇦Panama
      • 🇰🇳Saint Kitts and Nevis
      • 🇱🇨Saint Lucia
      • 🇻🇨Saint Vincent and the Grenadines
      • 🇹🇨Turks and Caicos Islands (UK)
      • 🇺🇸United States of America
    • South America
      • 🇦🇷Argentina
      • 🇧🇴Bolivia
      • 🇧🇷Brazil
      • 🇨🇱Chile
      • 🇨🇴Colombia
      • 🇪🇨Ecuador
      • 🇬🇾Guyana
      • 🇳🇮Nicaragua
      • 🇵🇾Paraguay
      • 🇵🇪Peru
      • 🇸🇷Suriname
      • 🇹🇹Trinidad and Tobago
      • 🇺🇾Uruguay
      • 🇻🇪Venezuela
    • Oceania
      • 🇦🇺Australia
      • 🇫🇯Fiji
      • 🇵🇫French Polynesia (France)
      • 🇰🇮Kiribati
      • 🇲🇭Marshall Islands
      • 🇫🇲Micronesia
      • 🇳🇷Nauru
      • 🇳🇨New Caledonia (France)
      • 🇳🇿New Zealand
      • 🇵🇼Palau
      • 🇵🇬Papua New Guinea
      • 🇸🇭Saint Helena (UK)
      • 🇼🇸Samoa
      • 🇸🇧Solomon Islands
      • 🇹🇴Tonga
      • 🇹🇻Tuvalu
      • 🇻🇺Vanuatu
Powered by GitBook
On this page
  • Webview usage tips:
  • Load Uqudo Web SDK URL

Was this helpful?

  1. KYC
  2. Uqudo SDK
  3. Integration
  4. Web

Webview Usage

To integrate the Uqudo Web SDK into your WebView implementation, follow the guide below :

Webview usage tips:

  • Enable JavaScript in WebView

  • Enable allowsInlineMediaPlayback in your IOS Webview implementation

  • In Android, it is recommended to use WebChromeClient to handle camera access within a WebView.

Below are examples of how to implement Uqudo SDK Webview in different programming languages and frameworks.

Java (Android):

package com.example.myapplication;
import android.Manifest;
import android.os.Build;
import android.content.pm.PackageManager;
import android.os.Bundle;
import android.webkit.PermissionRequest;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import androidx.appcompat.app.AppCompatActivity;
import androidx.core.content.ContextCompat;

public class MainActivity extends AppCompatActivity {

            @Override
            protected void onCreate(Bundle savedInstanceState) {
                super.onCreate(savedInstanceState);
                setContentView(R.layout.activity_main);
                WebView webView = findViewById(R.id.webView);
                WebSettings webSettings = webView.getSettings();
                
                // Enable Javascript
                webSettings.setJavaScriptEnabled(true);
                webSettings.setDomStorageEnabled(true);

                // Check camera permission and request if not granted
                if (ContextCompat.checkSelfPermission(this, Manifest.permission.CAMERA) != PackageManager.PERMISSION_GRANTED) {
                    ActivityCompat.requestPermissions(this, new String[]{Manifest.permission.CAMERA}, 1);
                }
                webView.setWebChromeClient(new WebChromeClient() {
                    @Override
                    public void onPermissionRequest(final PermissionRequest request) {
                        // Check for camera permission
                        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                            for (String permission : request.getResources()) {
                                if (PermissionRequest.RESOURCE_VIDEO_CAPTURE.equals(permission)) {
                                    runOnUiThread(new Runnable() {
                                        @Override
                                        public void run() {
                                            if (ContextCompat.checkSelfPermission(MainActivity.this, Manifest.permission.CAMERA) == PackageManager.PERMISSION_GRANTED) {                                        
                                                request.grant(new String[]{PermissionRequest.RESOURCE_VIDEO_CAPTURE});                  
                                            } else {
                                                request.deny();
                                            }}});
                                    return;
                                }}}
                        super.onPermissionRequest(request);
                    }
                });
                webView.loadUrl("https://your-uqudo-sdk-url.com");
            }}

Kotlin (Android):

package com.example.myapplication

import android.Manifest
import android.content.pm.PackageManager
import android.os.Build
import android.os.Bundle
import android.webkit.PermissionRequest
import android.webkit.WebChromeClient
import android.webkit.WebSettings
import android.webkit.WebView
import androidx.appcompat.app.AppCompatActivity
import androidx.core.app.ActivityCompat
import androidx.core.content.ContextCompat

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val webView = findViewById<WebView>(R.id.webView)
        val webSettings = webView.settings

        // Enable Javascript
        webSettings.javaScriptEnabled = true
        webSettings.domStorageEnabled = true

        // Check camera permission and request if not granted
        if (ContextCompat.checkSelfPermission(this, Manifest.permission.CAMERA) != PackageManager.PERMISSION_GRANTED) {
            ActivityCompat.requestPermissions(this, arrayOf(Manifest.permission.CAMERA), 1)
        }

        webView.webChromeClient = object : WebChromeClient() {
            override fun onPermissionRequest(request: PermissionRequest) {
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                    for (permission in request.resources) {
                        if (PermissionRequest.RESOURCE_VIDEO_CAPTURE.equals(permission)) {
                            runOnUiThread {
                                if (ContextCompat.checkSelfPermission(this@MainActivity, Manifest.permission.CAMERA) == PackageManager.PERMISSION_GRANTED) {
                                    request.grant(arrayOf(PermissionRequest.RESOURCE_VIDEO_CAPTURE))
                                } else {
                                    request.deny()
                                }
                            }
                            return
                        }
                    }
                }
                super.onPermissionRequest(request)
            }
        }
        webView.loadUrl("https://your-uqudo-sdk-url.com")
    }
}

Swift (iOS):

import UIKit
import WebKit

class ViewController: UIViewController, WKNavigationDelegate {

    var webView: WKWebView!

    override func viewDidLoad() {
        super.viewDidLoad()

        let webViewConfiguration = WKWebViewConfiguration()
        webView = WKWebView(frame: .zero, configuration: webViewConfiguration)
        webView.navigationDelegate = self
        view = webView

        // Enable JavaScript
        webView.configuration.preferences.javaScriptEnabled = true
        
        // Enable allowsInlineMediaPlayback
        webView.configuration.allowsInlineMediaPlayback = true
         
        // Load your Uqudo Web SDK URL
        let url = URL(string: "https://your-uqudo-sdk-url.com")!
        webView.load(URLRequest(url: url))
        webView.allowsBackForwardNavigationGestures = true
    }
}

React Native (JavaScript):

import React from 'react';
import { WebView } from 'react-native-webview';

const MyWebViewComponent = () => {
  return (
    <WebView
      source={{ uri: 'https://your-uqudo-sdk-url.com' }}
      javaScriptEnabled={true}
      domStorageEnabled={true}
      allowsInlineMediaPlayback={true}
    />
  );
};

export default MyWebViewComponent;

Flutter (Dart):

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class MyWebViewWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return WebView(
      initialUrl: 'https://your-uqudo-sdk-url.com',
      javascriptMode: JavascriptMode.unrestricted,
      allowsInlineMediaPlayback: true,
    );
  }
}

Xamarin (C#):

using Xamarin.Forms;

namespace MyApp
{
    public partial class MyWebViewPage : ContentPage
    {
        public MyWebViewPage()
        {
            InitializeComponent();

            var webView = new WebView
            {
                Source = new UrlWebViewSource
                {
                    Url = "https://your-uqudo-sdk-url.com"
                },
                VerticalOptions = LayoutOptions.FillAndExpand
            };

            webView.Settings.JavaScriptEnabled = true;

            Content = webView;
        }
    }
}

Load Uqudo Web SDK URL

Make sure to load the URL of the Uqudo Web SDK into your WebView. Replace "https://your-uqudo-sdk-url.com" with the actual URL of your Uqudo Web SDK.

Feel free to customize the examples provided according to your specific implementation needs. If you encounter any issues or have further questions, refer to the Uqudo Web SDK documentation or reach out to our support team for assistance.

PreviousAssets & ImagesNextAnalytics

Last updated 1 month ago

Was this helpful?