SafeTech has created multiple libraries to enable web developers to integrate FIDO compatibility into their websites and start providing SafeKey support with ease.
If you don't have access to a running configured php server no problem you can use the docker container provided.
Open a new terminal window and navigate to the root director of this repo on your machine and enter
docker-composer up
Open another separate terminal and enter the following commands
docker exec -it fido2-example /bin/bash
cd app
composer install
npm install
npm run build
After the installation of the packages dependencies has been completed navigate to the following URL
http://localhost:8082/dist/
Browser Compatibility
To get the latest details of which version of which browsers offer support for WebAuthn please visit Can I Use WebAuthn. As of writing (2019-06-28) the following browsers have support:
Microsoft Edge
Edge has support in version 18 and higher. However Edge is not updated independently of the operating system, this means that in order to update your version of Edge you will need to update your version of Windows 10.
Updating Windows 10 to the latest version may require a few steps, first check your computer has all pending updates installed by following the instructions here.
If after all available updates have been installed and your version of Edge is still lower than 17 you will need to manually update your OS. The latest update for Windows 10 can be found here.
This process may take a long time, so it may be easier to use a more popular browser that does support the latest in web security ;).
Server Side FIDO2/WebAuthn PHP Library
WebAuthn
For more detailed example of the library please see the dedicated repo.
WebAuthn Initialize
<?php
// Initialise
use SAFETECHio\FIDO2\WebAuthn;
$WebAConfig = new WebAuthn\WebAuthnConfig(
"Example Name",
"example.com",
"https://login.example.com", // Optional
"https://example.com/images/logo.png" // Optional
);
$WebA = new WebAuthn\WebAuthnServer($WebAConfig);
WebAuthn Register User
WebAuthn Begin Registration
<?php
// Begin Registration
use SAFETECHio\FIDO2\WebAuthn;
// create or find the registering user from your data store
$user = DB\User::FindOrCreate();
/** @var $WebA WebAuthn\WebAuthnServer */
list($options, $sessionData) = $WebA->BeginRegistration($user)->Make();
// sessionData should be saved in the registration session
session_start();
$_SESSION['registration_session'] = $sessionData;
echo json_encode($options);
// respond with the options
// options->publicKey contains the registration options
WebAuthn Complete Registration
<?php
// Complete Registration
use SAFETECHio\FIDO2\WebAuthn;
// find the registering user from your data store
$user = DB\User::Find();
// Get the session data stored in the beginRegistration step
session_start();
$sessionData = $_SESSION['registration_session'];
// Call the WebAuthn->completeRegistration() func
/** @var $WebA WebAuthn\WebAuthnServer */
$credential = $WebA->completeRegistration($user, $sessionData, $jsonResponse);
// If creation was successful, store the credential object
$user->Credentials()->Create($credential);
// Destroy the registration session
unset($_SESSION['registration_session']);
// Respond with a success message
echo json_encode("Registration Success");
WebAuthn Authenticate User
WebAuthn Begin Authentication
<?php
// Begin Authentication
use SAFETECHio\FIDO2\WebAuthn;
// find the registering user from your data store
$user = DB\User::Find();
/** @var $WebA WebAuthn\WebAuthnServer */
list($options, $sessionData) = $WebA->beginAuthentication($user);
// sessionData should be saved in the authentication session
session_start();
$_SESSION['authentication_session'] = $sessionData;
echo json_encode($options);
// respond with the options
// options->publicKey contains the registration options
WebAuthn Complete Authentication
<?php
// Complete Authentication
use SAFETECHio\FIDO2\WebAuthn;
// find the registering user from your data store
$user = DB\User::Find();
// Get the authentication session data stored in the beginAuthentication step
session_start();
$sessionData = $_SESSION['authentication_session'];
/** @var $WebA WebAuthn\WebAuthnServer */
$credential = $WebA->completeAuthentication($user, $sessionData);
// Destroy the registration session
unset($_SESSION['authentication_session']);
// Respond with a success message
echo json_encode("Registration Success");
Docker
To get set up with docker.
docker-composer up
In a separate terminal
docker exec -it fido2-app /bin/bash
Client Side FIDO2/WebAuthn JS Library
For more advanced details of how to use this library please see the php full stack example.
Installation
npm install SAFETECHio/FIDO2_CLIENT_Libraries
Example Use
The JS
import {SAFETECHioWebAuthn, SAFETECHioWebAuthnConfig} from 'fido2_clientside';
let config = new SAFETECHioWebAuthnConfig();
config.registerBeginEndpoint += "../backend/RegisterBegin.php?username=";
config.registerCompleteEndpoint += "../backend/RegisterComplete.php?username=";
config.authenticateBeginEndpoint += "../backend/AuthenticateBegin.php?username=";
config.authenticateCompleteEndpoint += "../backend/AuthenticationComplete.php?username=";
config.usernameInputID = "#email";
config.giveErrorAlert = true;
config.giveSuccessAlert = true;
let SafeTechWebAuthn = new SAFETECHioWebAuthn(config);
export {config, SafeTechWebAuthn};
