How to Add Passkey Authentication to Your App with AuthAction Passkey Plus

#webauthn #passkey #authentication #security

Passkey Plus by AuthAction brings modern, phishing-resistant authentication to your application — built on WebAuthn and designed for simplicity. It can be easily integrated alongside your existing authentication solutions, allowing users to choose their preferred login method while enhancing security through modern authentication protocols. It can be used both during the login process and as an additional security layer in settings pages, where users need to re-authenticate for sensitive operations.

In this post, you’ll learn how to integrate Passkey Plus into your app using both the frontend SDK and backend APIs.

🔧 Step 1: Get an Access Token

Create Passkey Plus application in AuthAction dashboard. Use your passkey plus client_id and client_secret to request an access token for the AuthAction Management API.

curl --request POST \
  --url https://<tenant-name>.<tenant-region>.authaction.com/oauth2/m2m/token \
  --header 'content-type: application/json' \
  --data '{
    "client_id": "your-passkey-plus-client-id",
    "client_secret": "your-passkey-plus-client-secret",
    "audience": "https://your-tenant-domain",
    "grant_type": "client_credentials"
  }'

You’ll receive an access_token.

🔐 Step 2: Create a Registration Transaction

Use the token to start a new Passkey registration transaction:

curl --request POST \
  --url https://<your-tenant>.<tenant-region>.authaction.com/api/v1/passkey-plus/YOUR_APP_ID/transaction/register \
  --header 'Authorization: Bearer YOUR_ACCESS_TOKEN' \
  --header 'content-type: application/json' \
  --data '{
    "externalId": "unique-user-id-in-your-system",
    "displayName": "Jane Doe"
  }'

You’ll receive a transactionId to use on the frontend. Similarly you can use for transaction/authenticate use case.

💻 Step 3: Install the SDK in Your Frontend

Install the Passkey Plus SDK:

npm install @authaction/passkey-plus-sdk

Initialize it in your app:

import { PasskeyPlus } from "@authaction/passkey-plus-sdk";

const passkeyPlus = new PasskeyPlus({
  tenantDomain: "your-tenant.region.authaction.com",
  appId: "your-passkey-plus-app-id",
});

✅ Step 4: Register and Authenticate Users

Trigger passkey registration:

const nonce = await passkeyPlus.register("transaction-id", {
  authenticatorAttachment: "platform", // or "cross-platform"
});

Trigger passkey authentication:

const nonce = await passkeyPlus.authenticate("transaction-id", {
  isConditionalMediation: true,
});

🔁 Step 5: Verify the Nonce on Backend

After registration/authentication, verify the nonce on your backend:

curl --request POST \
  --url https://your-tenant.authaction.com/api/v1/passkey-plus/YOUR_APP_ID/transaction/verify \
  --header 'Authorization: Bearer YOUR_ACCESS_TOKEN' \
  --header 'content-type: application/json' \
  --data '{
    "nonce": "nonce-from-frontend"
  }'