🙇User Onboarding

Camp is the only team in Web3 with verified Web2 data for users to monetize their identities and provide insights for dApps built on Camp.

Camp Auth Hub

At any time, users can access Camp Auth Hub (http://auth-hub.campnetwork.xyz/) to connect their wallet and sign into various social accounts to make their data avaiable to dApps on Camp Network.

Accessing Camp Auth Hub

  1. Connect Wallet: Sign in with your wallet.

  2. Sign In to Web2 Accounts: Use SSO to connect your Web2 accounts.

Managing Data Access

  1. View Accounts: See all connected Web2 accounts.

  2. Revoke Access: Disconnect specific or all accounts at anytime.

  3. Remove Data: All data is securely removed upon revocation.

Camp Auth SDK

The Camp Auth SDK enables dApp developers to integrate Camp Auth Hub functionality directly into their applications. This allows users to authenticate and onboard their social data seamlessly within the dApp environment, enhancing the user experience and providing continuous access to verified and encrypted data across the Camp Network.

Features

  • Wallet Authentication: Enables users to sign in with their Camp wallet.

  • Single Sign-On (SSO): Facilitates SSO into supported Web2 platforms.

  • Data Management: Automates data pulling, verification, encryption, and availability to dApps.

  • User Control: Allows users to revoke data access and remove their data from the network.

Installation

To integrate the Camp Auth SDK into your dApp, follow these steps:

  • Install the SDK

    First, add the Camp Auth SDK to your project using npm or yarn.

    npm install @campnetwork/auth-sdk

    or

    yarn add @campnetwork/auth-sdk
  • Import the SDK

    Import the necessary components from the SDK into your project.

    import { CampAuth } from '@campnetwork/auth-sdk';
  • Initialize the SDK

    Initialize the SDK with your dApp's configuration settings.

    const campAuth = new CampAuth({
      apiKey: 'YOUR_API_KEY',
      redirectUri: 'YOUR_REDIRECT_URI',
    });
  • Authenticate the User

    Use the SDK to prompt users to sign in with their wallet and connect their Web2 accounts.

    async function authenticateUser() {
      try {
        // Prompt user to sign in with their wallet
        await campAuth.signInWithWallet();
    
        // Prompt user to connect Web2 accounts
        await campAuth.connectWeb2Accounts(['twitter', 'instagram']);
      } catch (error) {
        console.error('Authentication failed:', error);
      }
    }
  • Access User Data

    Once authenticated, you can access the user's social data.

    async function getUserData() {
      try {
        const userData = await campAuth.getUserData();
        console.log('User Data:', userData);
      } catch (error) {
        console.error('Failed to fetch user data:', error);
      }
    }
  • Revoke Data Access

    Provide users with the option to revoke access to their data.

    async function revokeDataAccess() {
      try {
        await campAuth.revokeAccess();
        console.log('Data access revoked.');
      } catch (error) {
        console.error('Failed to revoke data access:', error);
      }
    }

Example Usage

Below is an example of how to integrate the Camp Auth SDK into a React component:

import React, { useEffect, useState } from 'react';
import { CampAuth } from '@campnetwork/auth-sdk';

const App = () => {
  const [userData, setUserData] = useState(null);

  useEffect(() => {
    const initializeAuth = async () => {
      const campAuth = new CampAuth({
        apiKey: 'YOUR_API_KEY',
        redirectUri: 'YOUR_REDIRECT_URI',
      });

      try {
        await campAuth.signInWithWallet();
        await campAuth.connectWeb2Accounts(['twitter', 'instagram']);
        const data = await campAuth.getUserData();
        setUserData(data);
      } catch (error) {
        console.error('Authentication failed:', error);
      }
    };

    initializeAuth();
  }, []);

  const handleRevokeAccess = async () => {
    const campAuth = new CampAuth({
      apiKey: 'YOUR_API_KEY',
      redirectUri: 'YOUR_REDIRECT_URI',
    });

    try {
      await campAuth.revokeAccess();
      setUserData(null);
    } catch (error) {
      console.error('Failed to revoke data access:', error);
    }
  };

  return (
    <div>
      <h1>Camp Auth Example</h1>
      {userData ? (
        <div>
          <h2>User Data:</h2>
          <pre>{JSON.stringify(userData, null, 2)}</pre>
          <button onClick={handleRevokeAccess}>Revoke Access</button>
        </div>
      ) : (
        <p>No user data available.</p>
      )}
    </div>
  );
};

export default App;

Last updated