DEV Community

Natalie for LoginID

Posted on

LoginID biometric authentication Web SDK tutorial

Initial Setup

The LoginID Web SDK enables you to add FIDO-certified authentication in your web-based application without having to redirect the user to any pages outside your application.

For more robust functionality, it is likely that you will need to also leverage a Server SDK. The Server SDK makes requests to LoginID's API easier by leveraging your API Credential. Check out the LoginID Server SDK for a simplified integration.

Create Application on the Dashboard

An application must be created on the LoginID Dashboard in order to correctly configure the Web SDK.

Once logged into the dashboard, navigate to the Applications tab in the sidebar, select “Add Application,” and select Web.

In the resulting form, you must create a name for your application and provide your website URL.

NOTE
Unlike in the OAuth/OpenID Connect flow, the Website URL is not a callback URL. The Website URL is the top-level domain that is integrating the Web SDK functionality. LoginID's backend will check this domain against your client profile as an allowable domain to issue cross-origin requests.

After entering your name and website URL, you will be prompted to create an API credential. If you have a client-side only application, please skip this step. Otherwise, create an API credential.

NOTE
An API service token must be included on all requests with a service token scope once an API credential is assigned to an application.

Add SDK to Existing Application

CDN

<script src=”https://loginid-sdk.s3-us-west-1.amazonaws.com/sdk/js/0.9.8/loginid.web.min.js”></script>
Enter fullscreen mode Exit fullscreen mode

NPM

npm install --save @loginid/sdk
Enter fullscreen mode Exit fullscreen mode

Create an SDK Instance

Javascript
NPM

import WebSDK from ‘@loginid/sdk';
const l = new WebSDK(‘BASE_URL’, ‘CLIENT_ID’);
Enter fullscreen mode Exit fullscreen mode

HTML
CDN

<!-- Import module from the JS SDK -->
<script src="./src/vendor/loginid.web.min.js"></script>
<script>
  const dw = new web.default(
      "{BASE_URL}", "{CLIENT_ID}"
  );
  // ...
</script>
Enter fullscreen mode Exit fullscreen mode

Sign up for free: https://usw1.loginid.io/en/register/get-started-a

Top comments (0)