Skip to content

Web Native Bridge

Miquel edited this page Nov 22, 2024 · 7 revisions

Introduction

iProov's Web SDK provides a feature-complete implementation of iProov, developed purely in web technologies and runs in all modern browsers.

We now provide a Web/Native bridge which will seamlessly launch the native Android SDK from your WebView-based app, iProov the user, and then transparently deliver the callbacks to your WebView-based app.

This has been designed to require minimal implementation changes to your app, by translating the native callbacks into JavaScript events.

We have also implemented this in such a way that if your webpages are served both in-app (via a WebView) and also via a conventional browser, users can iProov either via the Web SDK or native SDK, depending on whether camera access is supported.

Web Native Bridge 1.0 was introduced into the iProov Android SDK in v5.2, we have now upgraded to Web Native Bridge 2.0 which offers a much simpler integration route. Please consult the following table to determine which Native Bridge version is supported in your iProov SDK version:

Android SDK Native Bridge Web SDK
SDK v5.1 and older Unsupported Unsupported
SDK v5.2 to v5.23 Native Bridge 1.0 >=2.0.0 <3.0.0
SDK v6.0 and newer Native Bridge 2.0 >=2.1.0

Installation

Installation (web)

You need to integrate the iProov Web SDK into your app's webpage(s). Follow the integration instructions here.

TIP: Once the iProov Web SDK has been integrated, test it is working properly in a conventional browser (e.g. Mobile Safari) before proceeding.

Installation (app)

You need to add the iProov Android SDK to your native app. Follow the installation instructions here.

NOTE: You only need to follow the "Installation" instructions, not "Get Started".

The instructions now differ depending on whether you are using Native Bridge 2.0 or 1.0 (legacy).


Native Bridge 2.0

Implementation (web)

No further work is required.

Implementation (app)

  1. Enable JavaScript execution in your WebView:

    webView.settings.javaScriptEnabled = true
  2. As early as possible in the WebView's lifecycle (e.g. in Activity.onCreate()) call the following:

    val nativeBridge: NativeBridge? = null
    
    override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
       nativeBridge = NativeBridge()
       nativeBridge!!.install(webView, false)
    }
  3. Make sure to clean up resources at the end of your WebView's lifecycle (e.g. in Activity.onDestroy()) by calling:

    override fun onDestroy() {
         nativeBridge!!.uninstall(webView)
         nativeBridge = null
         super.onDestroy()
     }

NOTE: After uninstall method is called on a NativeBridge instance, that same instance should be discarded and not used anymore. If needed, a new instance should be crated.


Native Bridge 1.0

Implementation (web)

You need to make sure you set the prefer_app attribute on your <iproov-me> element, so that the Web SDK will attempt to launch the native SDK when the launch button is pressed. You should either set it to "always" (for pages that are only ever accessed via a WebView), or "android-webview" (if the pages are served both via WebViews and via traditional browsers).

Implementation (app)

  1. Enable JavaScript execution in your WebView:

    webView.settings.javaScriptEnabled = true
  2. You need to pass the WebView navigation events to the iProov SDK so that it will be launched when requested by the Web SDK, you do this by attaching a WebViewClient:

    Kotlin
    webView.webViewClient = object : WebViewClient() {
    
    	@RequiresApi(Build.VERSION_CODES.LOLLIPOP)
    	override fun shouldOverrideUrlLoading(view: WebView?, request: WebResourceRequest?): Boolean
    		= request?.let { IProov.handle(it.url, view!!) } ?: false
    
    	override fun shouldOverrideUrlLoading(view: WebView?, url: String?): Boolean
    		= url?.let { IProov.handle(Uri.parse(it), view!!) } ?: false
    }
    Java
    webView.setWebViewClient(new WebViewClient() {
    
        @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
            return IProov.handle(request.getUrl(), view);
        }
    
        @Override
        public boolean shouldOverrideUrlLoading(WebView view, String url) {
            return IProov.handle(Uri.parse(url), view);
        }
        
    });

    Note: The IProov.handle() call is only ever used to determine whether to launch the native SDK in response to the navigation event, and this is done locally on-device. iProov does not monitor or collect the navigation events in your app. If you are concerned about this call from a privacy perspective, you can feel free to add an additional check to only pass iProov URL's with the host iproov.app.


🎉 Congratulations! You have now successfully integrated the Web/Native bridge. You can now try launching the iProov Web SDK from within your WebView-based app. You should find that the native SDK is launched, and then delivers the callbacks straight back to the Web SDK.

If you require further assistance, please contact iProov support.