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
  • Token Gate Anything
  • Login User w/ Token Ownership Requirements
  • Using Access Tokens
  1. Quick Start Guides
  2. Quick Start Guides

Token Gating (Ethereum / EVM)

A guide to start token gating anything in minutes.

PreviousWallet LoginNextToken Gating (Solana)

Last updated 2 years ago

Requirements

Before continuing make sure you've followed the

Token Gate Anything

You can use Picket to token gate anything. If you want to authenticate users and verify their token ownership, you can pass the token ownership requirements to the login() function.

Login User w/ Token Ownership Requirements

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

const picket = new Picket('YOUR_PUBLISHABLE_KEY_HERE');

// These requirements are for the Ethereum Mainnet
// See Token Ownership Requirements section below for examples of 
// requirements other supported chain.
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 
}

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>
  );
}

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 
}

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 '{
      "chain": "ethereum",
      "walletAddress": "0xWALLET_ADDRESS",
      "signature": "SUPER_SECRET_SIGNATURE",
      "contractAddress": "CONTRACT_ADDRESS",
      "minTokenBalance": 1
    }'

Token Ownership Requirements

// Same as the requirements above
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 
}

You successfully validated a user's wallet and token ownership!

The returned access token can now act as secure proof of token ownership until expiration. It can be passed server side and verified there in order to restrict resources to authenticated wallets with whichever token ownership requirements you have.

Using Access Tokens

Picket currently defaults to using the . While using ethereum contract address can be any contract address for an ERC20 token or an NFT (including ERC-721 and ERC-1155.) Picket also authentication and authorization on other chains like Solana. See for the complete list.

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
ethereum (Mainnet) chain
supported blockchains
working with access tokens guide
๐Ÿ”‘Working with Access Tokens