Picket Docs
  • ๐Ÿ‘‹Welcome to Picket
  • Quick Start Guides
    • ๐Ÿš€Quick Start Guides
      • โš™๏ธStart Here: Setup
      • ๐Ÿ”Wallet Login
      • ๐Ÿช™Token Gating (Ethereum / EVM)
      • ๐ŸคบToken Gating (Solana)
      • ๐Ÿคนโ€โ™‚๏ธIncremental Token Gating
      • โ›”Restrict Access to Specific Wallets
      • ๐Ÿ”‘Working with Access Tokens
  • Reference
    • ๐ŸŽ“Concepts
      • ๐ŸŒŠAuth Flow
      • ๐Ÿ—ƒ๏ธConnect
      • โœ๏ธSignatures
      • ๐Ÿ”Authentication and Authorization
      • ๐ŸคนIncremental Authorization
      • ๐Ÿช™Access Tokens
      • ๐ŸงชTesting
      • โ‰๏ธErrors
      • โ›“๏ธSupported Blockchains
      • ๐ŸŒSupported Languages (Localization)
      • ๐ŸŽจModal Themes
      • ๐Ÿ’ฟOpen Source Web3 Client Libraries
    • ๐Ÿ“šLibraries and SDKs
      • Javascript Library - picket-js
      • React SDK - picket-react
      • Node.js Library - picket-node
      • Go Library - picket-go
      • Python Library - picket-python
    • ๐Ÿ”ฅIntegrations
      • ๐ŸŒˆPicket Authentication with RainbowKit
      • โšกSupabase
      • โ˜๏ธAmazon Cognito
      • ๐Ÿ›๏ธPicket Shopify App - Merchant Documentation
      • ๐Ÿ›’Picket BigCommerce App - Merchant Documentation
    • ๐Ÿ“–API Reference
      • Projects & API Keys
      • Auth
      • Chains
      • Wallets
      • Contracts
      • OAuth 2.0
  • ๐Ÿ•น๏ธTutorials
    • ๐ŸŒŽSign-In with Wallet (React)
    • ๐ŸฐToken Gated Photo Board (React)
    • ๐Ÿ”—Link a Wallet to a Web 2.0 Account
    • ๐ŸคIncremental Authorization (React)
Powered by GitBook
On this page
  • Requirements
  • Restrict Access to Specific Wallets
  • Login User w/ a Allowed Wallet List
  • Using Access Tokens
  1. Quick Start Guides
  2. Quick Start Guides

Restrict Access to Specific Wallets

A guide to restricting access based on a list of allowed wallet addresses

PreviousIncremental Token GatingNextWorking with Access Tokens

Last updated 2 years ago

Requirements

Before continuing make sure you've followed the

Restrict Access to Specific Wallets

You can use Picket to gate access by a list of allowed wallets. All you need to do is pass the allowedWallets requirements to the login() function.

Login User w/ a Allowed Wallet List

import Picket from "@picketapi/picket-js";

const picket = new Picket('YOUR_PUBLISHABLE_KEY_HERE');

// Restrict access to a set of predefined wallets 
const requirements = {
    allowedWallets: ["0xYOUR", "0xWALLET", "0xADDRESSES","0xHERE"]
}

const { accessToken,  user } = await picket.login(requirements);
console.log(user);
import { PicketProvider, usePicket } from "@picketapi/picket-react";

function MyApp({ children }) {
  return (
    <PicketProvider apiKey="YOUR_PUBLISHABLE_KEY_HERE">
      {children}
    </PicketProvider>
  );
}

// Restrict access to a set of predefined wallets
const requirements = {
    allowedWallets: ["0xYOUR", "0xWALLET", "0xADDRESSES","0xHERE"]
}


function MySecurePage() {
  const { 
          isAuthenticating, 
          isAuthenticated, 
          authState, 
          logout,
          login
          } = usePicket();
  
  // user is logging in
  if (isAuthenticating) return "Loading";

  // user is not logged in
  if (!isAuthenticated) {
      return (
        <div>
            <p>You are not logged in!</p>
            <button onClick={() => login(requirements)}>Login with Wallet</button>
        </div>
      )
  }

  // user is logged in ๐ŸŽ‰
  const { user } = authState;
  const { walletAddress } = user;
  
  return (
    <div>
       <p>You are logged in as {walletAddress} </p>
       <button onClick={() => logout()}>Logout</button>
    </div>
  )
}
curl https://picketapi.com/api/v1/auth \
    -X POST \
    -u PROJECT_SECRET_KEY \
    -H 'Content-Type: application/json' \
    -d '{
      "walletAddress": "0xWALLET_ADDRESS",
      "signature": "SUPER_SECRET_SIGNATURE",
      "allowedWallets": ["0xYOUR", "0xWALLET", "0xADDRESSES","0xHERE"]
    }'

You successfully restricted access to specific wallets

The returned access token can now act as secure proof of wallet ownership until expiration. It can be passed server side and verified there in order to restrict resources to specific wallets

Allowed Wallets and Token Ownership Requirements

If both allowedWallets and token ownership requirements are passed to the login function, then the user will be granted access if they either are on the allowed wallets list or meet the token ownership requirements.

Testing Tip

Using both allowedWallets and token ownership requirements can be helpful for testing a token-gating page, which you are developing, but don't own the necessary tokens for.

import Picket from "@picketapi/picket-js";

const picket = new Picket("YOUR_PUBLISHABLE_KEY_HERE");

// Restrict access to a set of predefined wallets or token holders
const requirements = {
    // optional. The default chain is the Ethereum Mainnet
    chain: "ethereum",
    // Replace this example address with whichever contract you are verifying ownership for
    contractAddress: "0x8a90cab2b38dba80c64b7734e58ee1db38b8992e", 
    // Replace with minimum balance you want to verify users' currently hold, 
    // or omit if any number of tokens is sufficient
    minTokenBalance: 1, 
    allowedWallets: ["0xYOUR", "0xWALLET", "0xADDRESSES","0xHERE"]
}

const { accessToken,  user } = await picket.login(requirements);
console.log(user);
import { PicketProvider, usePicket } from "@picketapi/picket-react";

function MyApp({ children }) {
  return (
    <PicketProvider apiKey="YOUR_PUBLISHABLE_KEY_HERE">
      {children}
    </PicketProvider>
  );
}

// Restrict access to a set of predefined wallets
// Restrict access to a set of predefined wallets or token holders
const requirements = {
    // optional. The default chain is the Ethereum Mainnet
    chain: "ethereum",
    // Replace this example address with whichever contract you are verifying ownership for
    contractAddress: "0x8a90cab2b38dba80c64b7734e58ee1db38b8992e", 
    // Replace with minimum balance you want to verify users' currently hold, 
    // or omit if any number of tokens is sufficient
    minTokenBalance: 1, 
    allowedWallets: ["0xYOUR", "0xWALLET", "0xADDRESSES","0xHERE"]
}


function MySecurePage() {
  const { 
          isAuthenticating, 
          isAuthenticated, 
          authState, 
          logout,
          login
          } = usePicket();
  
  // user is logging in
  if (isAuthenticating) return "Loading";

  // user is not logged in
  if (!isAuthenticated) {
      return (
        <div>
            <p>You are not logged in!</p>
            <button onClick={() => login(requirements)}>Login with Wallet</button>
        </div>
      )
  }

  // user is logged in ๐ŸŽ‰
  const { user } = authState;
  const { walletAddress } = user;
  
  return (
    <div>
       <p>You are logged in as {walletAddress} </p>
       <button onClick={() => logout()}>Logout</button>
    </div>
  )
}
curl https://picketapi.com/api/v1/auth \
    -X POST \
    -u PROJECT_SECRET_KEY \
    -H 'Content-Type: application/json' \
    -d '{
      "walletAddress": "0xWALLET_ADDRESS",
      "signature": "SUPER_SECRET_SIGNATURE",
      "chain": "ethereum",
      "contractAddress": "0xCONTRACT_ADDRESS",
      "minTokenBalance": 1
      "allowedWallets": ["0xYOUR", "0xWALLET", "0xADDRESSES","0xHERE"]
    }'

Using Access Tokens

Allowed wallet lists can be used in combination with .

Congrats ๐ŸŽ‰ your user is now successfully logged in. After authenticated/authorizing a user, you get an access token. You can use this access token to make secure requests to your backend. Read more in the .

๐Ÿš€
โ›”
setup guide
โš™๏ธStart Here: Setup
token ownership requirements
working with access tokens guide
๐Ÿ”‘Working with Access Tokens