Webview

To use Verisoul in mobile apps you'll need to run the client SDK in a native webview. Verisoul can work in React Native, Native IOS and Native Android apps.

Usage

The workflow follows the same pattern as the standard web integration except that you will need to listen for a session_id from a native webview.

The webview should be opened in the background and can remain completely invisible to the user.

Open the webview

Open a native webview and navigate to the following Verisoul URL with a valid project_id and env {prod, sandbox}.

var webViewUrl : String {
  return "https://js.verisoul.ai/\(env)/webview.html?project_id=\(projectId)"
}

self.wkWebview.load(URLRequest(url: URL(string: webViewUrl)!))

val webView = findViewById<WebView>(R.id.webview)
webView.settings.javaScriptEnabled = true
webView.settings.domStorageEnabled = true // Enable DOM storage API

webView.addJavascriptInterface(JSBridge(this), "JSBridge")
webView.loadUrl("https://js.verisoul.ai/$env/webview.html?project_id=$projectId")

Listen for session_id

Listen for a message from the webview that includes the session_id. The session_id is required to authenticate an account so you'll need to pass that to your backend in order to call the Verisoul API.

// listen for message from the webview
wkWebview.configuration.userContentController = userContentController
wkWebview.configuration.userContentController.add(self, name: nativeToWebHandler)

// parse session_id and pass to your backend
public func userContentController(_ userContentController: WKUserContentController,
                                      didReceive message: WKScriptMessage) {
        guard
            let body = message.body as? [String: String],
            message.name.lowercased() == nativeToWebHandler.lowercased(),
            let sessionId = body["session_id"]
  
            // pass to your backend
            // ...
        else {
            return
        }
}

class JSBridge(private val context: Context) {
  @JavascriptInterface
  fun verisoulHandler(message: String) {
    val messageJSON = JSONObject(message)

    val json = JSONObject().apply {
      put("session_id", messageJSON.getString("session_id"))
      // pass to your backend
      // ...
    }
  }
}

Close the webview

Upon retrieving the session_id and authenticating the session you can close the webview

wkWebview.removeFromSuperview()

webView.parent?.let { parentView ->
    if (parentView is ViewGroup) {
        parentView.removeView(webView)
    }
}

Sample Apps

Check out the sample apps to see a working webview integration:

React Native Sample App

Native IOS Sample App

Native Android Sample App