Developer Integration Guide

npm install qrcode-generator
# or
yarn add qrcode-generator

// Initialize authentication
const auth = new DigitalIdentityAuth({
  serverUrl: 'https://your-sso-server.com',
  clientId: 'your-client-id',
  callbackUrl: 'https://your-website.com/auth/callback'
});

// Start authentication flow
async function startAuth() {
  try {
    const { qrCode, sessionId } = await auth.initiateAuth();
    displayQRCode(qrCode);
    pollForCompletion(sessionId);
  } catch (error) {
    console.error('Authentication failed:', error);
  }
}

# Navigate to sample integration
cd sample-integration

# Install dependencies
npm install

# Configure environment
cp .env.example .env
# Edit .env with your settings

# Start the sample server
npm start

# Open in browser
# http://localhost:3001

class DigitalIdentityAuth {
  constructor(config) {
    this.serverUrl = config.serverUrl;
    this.clientId = config.clientId;
    this.clientSecret = config.clientSecret;
    this.callbackUrl = config.callbackUrl;
  }

  async initiateAuth() {
    const response = await fetch(`${this.serverUrl}/api/auth/third-party/authorize`, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
        'X-Client-ID': this.clientId,
        'X-Client-Secret': this.clientSecret
      },
      body: JSON.stringify({
        callback_url: this.callbackUrl,
        state: this.generateState(),
        nonce: this.generateNonce()
      })
    });

    if (!response.ok) {
      throw new Error('Failed to initiate auth');
    }

    return await response.json();
  }

  generateState() {
    return crypto.randomUUID();
  }

  generateNonce() {
    return crypto.randomUUID();
  }

  async pollForCompletion(sessionId) {
    const pollInterval = setInterval(async () => {
      try {
        const response = await fetch(
          `${this.serverUrl}/api/session/status?session=${sessionId}`
        );
        const data = await response.json();

        if (data.authenticated) {
          clearInterval(pollInterval);
          this.handleSuccess(data);
        }
      } catch (error) {
        clearInterval(pollInterval);
        this.handleError(error);
      }
    }, 2000);
  }

  handleSuccess(data) {
    // Redirect to your application's authenticated area
    window.location.href = `/dashboard?session=${data.sessionId}`;
  }

  handleError(error) {
    console.error('Authentication failed:', error);
    // Handle error (show user message, retry, etc.)
  }
}

// Usage
const auth = new DigitalIdentityAuth({
  serverUrl: 'https://your-sso-server.com',
  clientId: 'your-client-id',
  clientSecret: 'your-client-secret',
  callbackUrl: 'https://your-website.com/auth/callback'
});

// Start authentication
async function startAuth() {
  try {
    const { qrCode, sessionId } = await auth.initiateAuth();
    displayQRCode(qrCode);
    auth.pollForCompletion(sessionId);
  } catch (error) {
    showError('Failed to start authentication');
  }
}

const express = require('express');
const axios = require('axios');
const app = express();

// Authentication endpoint
app.post('/auth/initiate', async (req, res) => {
  try {
    const response = await axios.post(
      'https://your-sso-server.com/api/auth/third-party/authorize',
      {
        callback_url: 'https://your-website.com/auth/callback',
        state: generateState(),
        nonce: generateNonce()
      },
      {
        headers: {
          'Content-Type': 'application/json',
          'X-Client-ID': process.env.CLIENT_ID,
          'X-Client-Secret': process.env.CLIENT_SECRET
        }
      }
    );

    res.json(response.data);
  } catch (error) {
    res.status(500).json({ error: 'Authentication initiation failed' });
  }
});

// Callback endpoint
app.post('/auth/callback', async (req, res) => {
  const { vp_token, state } = req.body;
  
  try {
    // Verify state matches stored value
    if (!verifyState(state)) {
      return res.status(400).json({ error: 'Invalid state' });
    }

    // Process the VP token and extract user information
    const userInfo = await processVPToken(vp_token);
    
    // Create user session
    req.session.user = userInfo;
    
    res.json({ success: true, redirect: '/dashboard' });
  } catch (error) {
    res.status(500).json({ error: 'Authentication failed' });
  }
});

function generateState() {
  return require('crypto').randomUUID();
}

function generateNonce() {
  return require('crypto').randomUUID();
}

function verifyState(receivedState) {
  // Implement state verification logic
  return true; // Simplified for example
}

async function processVPToken(vpToken) {
  // Implement VP token processing
  // This should verify the JWT signature and extract claims
  return {
    sub: 'user-id',
    name: 'User Name',
    email: 'user@example.com'
  };
}

serverUrl = $config['serverUrl'];
        $this->clientId = $config['clientId'];
        $this->clientSecret = $config['clientSecret'];
        $this->callbackUrl = $config['callbackUrl'];
    }

    public function initiateAuth() {
        $data = [
            'callback_url' => $this->callbackUrl,
            'state' => $this->generateState(),
            'nonce' => $this->generateNonce()
        ];

        $response = $this->makeRequest('/api/auth/third-party/authorize', $data);
        return json_decode($response, true);
    }

    public function checkSessionStatus($sessionId) {
        $response = $this->makeRequest('/api/session/status', [], 'GET', [
            'session' => $sessionId
        ]);
        return json_decode($response, true);
    }

    private function makeRequest($endpoint, $data = [], $method = 'POST', $queryParams = []) {
        $url = $this->serverUrl . $endpoint;
        
        if (!empty($queryParams)) {
            $url .= '?' . http_build_query($queryParams);
        }

        $headers = [
            'Content-Type: application/json',
            'X-Client-ID: ' . $this->clientId,
            'X-Client-Secret: ' . $this->clientSecret
        ];

        $ch = curl_init();
        curl_setopt($ch, CURLOPT_URL, $url);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);

        if ($method === 'POST' && !empty($data)) {
            curl_setopt($ch, CURLOPT_POST, true);
            curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($data));
        }

        $response = curl_exec($ch);
        curl_close($ch);

        return $response;
    }

    private function generateState() {
        return bin2hex(random_bytes(16));
    }

    private function generateNonce() {
        return bin2hex(random_bytes(16));
    }
}

// Usage
$auth = new DigitalIdentityAuth([
    'serverUrl' => 'https://your-sso-server.com',
    'clientId' => $_ENV['CLIENT_ID'],
    'clientSecret' => $_ENV['CLIENT_SECRET'],
    'callbackUrl' => 'https://your-website.com/auth/callback'
]);

// Initiate authentication
if ($_POST['action'] === 'start_auth') {
    $result = $auth->initiateAuth();
    echo json_encode($result);
}

// Check session status
if ($_GET['action'] === 'check_status') {
    $sessionId = $_GET['session'];
    $status = $auth->checkSessionStatus($sessionId);
    echo json_encode($status);
}
?>

# SSO Server Configuration
OIDC4VP_SERVER_URL=https://your-sso-server.com
CLIENT_ID=your-client-id
CLIENT_SECRET=your-client-secret
CALLBACK_URL=https://your-website.com/auth/callback

# Security Configuration
JWT_SECRET=your-jwt-secret-key
SESSION_SECRET=your-session-secret

ALLOWED_ORIGINS=https://your-website.com,https://app.your-website.com
ALLOWED_CALLBACK_URLS=https://your-website.com/auth/callback

// Include Origin header in requests
const headers = {
    'Content-Type': 'application/json',
    'X-Client-ID': clientId,
    'Origin': window.location.origin // Required for CORS validation
};

<!-- Correct: Use div for SVG QR code -->
<div id="qr-code" class="qr-code-svg"></div>

<!-- Incorrect: Don't use img for SVG string -->
<img id="qr-image" src="" alt="QR Code">

// Correct: Inject SVG directly
const qrCodeDiv = document.getElementById('qr-code');
qrCodeDiv.innerHTML = response.qrCode;

// Incorrect: Don't set SVG string as image source
// qrImage.src = response.qrCode; // This causes 404 errors