@cashfreepayments/digilocker-js-sdk

Cashfree DigiLocker JS SDK

The DigiLocker JS SDK provides a seamless integration for DigiLocker services in web applications. This SDK enables secure document verification and retrieval through the DigiLocker platform, allowing businesses to implement KYC workflows efficiently.

Features

• Simple Integration: Easy-to-use API for DigiLocker integration
• Multiple Environment Support: Works in browsers, webviews, and iframe contexts
• React Compatible: Built-in React component for quick implementation
• Customizable UI: Use default buttons or custom UI elements

Installation

npm install @cashfreepayments/digilocker-js-sdk

Usage

React Implementation

import { Digilocker } from '@cashfreepayments/digilocker-js-sdk';

function MyComponent() {
  const handleComplete = (data) => {
    console.log('Verification completed:', data);
    // Handle verification result
  };

  return (
    <Digilocker
      documents={['AADHAAR', 'PAN', 'DRIVING_LICENSE']}
      onComplete={handleComplete}
      buttonText="Start DigiLocker KYC"
      config={{
        baseURL: 'https://your-api-endpoint.com',
        headers: {
          'Authorization': 'Bearer YOUR_TOKEN',
          'Content-Type': 'application/json'
        }
      }}
    />
  );
}

Custom Trigger Element

import { Digilocker } from '@cashfreepayments/digilocker-js-sdk';

function MyComponent() {
  return (
    <Digilocker
      documents={['AADHAAR', 'PAN']}
      onComplete={handleComplete}
      config={{
        baseURL: 'https://your-api-endpoint.com',
        headers: { /* your headers */ }
      }}
      trigger={<button className="my-custom-button">Verify with DigiLocker</button>}
    />
  );
}

API Reference

Digilocker Component

Prop	Type	Required	Default	Description
documents	string[]	No	['AADHAAR', 'PAN', 'DRIVING_LICENSE']	List of documents to request from DigiLocker
onComplete	(data: any) => void	Yes	-	Callback function called when verification is complete
buttonText	string	No	'Start DigiLocker KYC'	Text to display on the default button
config	{ baseURL: string; headers: Record<string, string> }	Yes	-	Configuration for API endpoints and headers
trigger	React.ReactElement	No	-	Custom element to trigger DigiLocker flow

Configuration Object

{
  baseURL: string;       // Your API base URL
  headers: {             // Headers to include in API requests
    Authorization: string;
    [key: string]: string;
  }
}

Response Object

The onComplete callback receives a response object with the following structure:

{
  status: string;        // Status of verification (e.g., 'AUTHENTICATED')
  verification_id: string; // Unique identifier for this verification
  document_consent: Array<{
    document_type: string; // Type of document verified
    document_id: string;  // Document identifier
    // Additional document details
  }>;
  // Additional verification details
}

Browser Compatibility

The SDK supports all modern browsers:

• Chrome (latest 2 versions)
• Firefox (latest 2 versions)
• Safari (latest 2 versions)
• Edge (latest 2 versions)

License

This project is licensed under the MIT License.