FIDO U2F WebView Bridge

Registering a new FIDO Security Key using the FIDO WebView Bridge

FIDO Authentication using the FIDO WebView Bridge

If you are using a WebView for your login flow and have already integrated FIDO U2F support in your webservice by using the FIDO JavaScript API, you can use the FIDO WebView Bridge for two-factor authentication. In this guide, you’ll learn how to add the FIDO Bridge to the WebView you use for your login process.

Fork sample code on Github: Fork sample code on Github

Try U2F Browser on Google Play: Try U2F Browser on Google Play

Add the SDK to Your Project

To get a username and password for our Maven repository, please contact us for a license.

Add this to your build.gradle:

repositories {
    google()
    jcenter()
    maven {
        credentials {
            username 'xxx'
            password 'xxx'
        }
        url "https://maven.cotech.de"
    }
}

dependencies {
    // FIDO implementation including UI
    implementation 'de.cotech:hwsecurity-fido:3.0.0'

    // Additional classes for local parsing and verification of FIDO messages
    // Usually not required for FIDO clients.
    //implementation 'de.cotech:hwsecurity-fido-util:3.0.0'
}

Initialize the Hardware Security SDK

To use the SDK’s functionality in your app, you need to initialize the SecurityKeyManager first. This is the central class of the SDK, which dispatches incoming NFC and USB connections. Perform this initialization in the onCreate method of your Application subclass. This ensures Security Keys are reliably dispatched by your app while in the foreground.

We start by creating a new class which extends android.app.Application as follows:

public class MyCustomApplication extends Application {
    @Override
    public void onCreate() {
        super.onCreate();

        SecurityKeyManager securityKeyManager = SecurityKeyManager.getInstance();
        SecurityKeyManagerConfig config = new SecurityKeyManagerConfig.Builder()
            .setEnableDebugLogging(BuildConfig.DEBUG)
            .build();
        securityKeyManager.init(this, config);
    }
}
class MyCustomApplication : Application() {
    override fun onCreate() {
        super.onCreate()

        val securityKeyManager = SecurityKeyManager.getInstance()
        val config = SecurityKeyManagerConfig.Builder()
            .setEnableDebugLogging(BuildConfig.DEBUG)
            .build()
        securityKeyManager.init(this, config)
    }
}

Then, register your MyCustomApplication in your AndroidManifest.xml:

<application 
    android:name=".MyCustomApplication"
    android:label="@string/app_name" 
...>

WebView Integration

JavaScript calls to window.u2f are delegated to the Hardware Security SDK. This is implemented by injecting a short JavaScript file into the currently loaded page. It intercepts API calls and delegates them to our FIDO implementation in Java. The WebViewFidoBridge does this automatically. Don’t forget to enable JavaScript in your WebView and delegate shouldInterceptRequest() and onPageStarted() calls to the WebViewFidoBridge as shown in the following:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    WebView webView = findViewById(R.id.webview);
    webView.getSettings().setJavaScriptEnabled(true);

    WebViewFidoBridge webViewFidoBridge = WebViewFidoBridge.createInstanceForWebView(this, webView);

    webView.setWebViewClient(new WebViewClient() {

        @Override
        public WebResourceResponse shouldInterceptRequest(WebView view, WebResourceRequest request) {
            webViewFidoBridge.delegateShouldInterceptRequest(view, request);
            return super.shouldInterceptRequest(view, request);
        }

        @Override
        public void onPageStarted(WebView view, String url, Bitmap favicon) {
            super.onPageStarted(view, url, favicon);
            webViewFidoBridge.delegateOnPageStarted(view, url, favicon);
        }

    });

    webView.loadUrl("https://u2f.hwsecurity.dev");
}

Prevent Re-Creation of Activity with USB Security Keys

Besides the functionalities used by our SDK, some Security Keys register themselves as USB keyboards to be able to insert One Time Passwords (OTP) when touching the golden disc. Thus, when inserting a Security Key into the USB port, Android recognizes a new keyboard and re-creates the current activity.

To prevent this, add keyboard|keyboardHidden to the activity’s configChanges in your AndroidManifest.xml:

<activity
    android:name=".MyCustomActivity"
    android:configChanges="keyboard|keyboardHidden"
... >

Profit

That’s all! If you have any questions, don’t hesitate to contact us: