Skip to content

Latest commit

 

History

History
389 lines (342 loc) · 10.3 KB

allow-list.md

File metadata and controls

389 lines (342 loc) · 10.3 KB
Raw
description
Learn how to use the Allow List Middleware to check whether a user is allowed to use your Frames.js Frames based on their Farcaster data.

🎭 Allow List

Get Started

First, install the Airstack Frames SDK:

{% tabs %} {% tab title="npm" %}

npm install @airstack/frames

{% endtab %}

{% tab title="yarn" %}

yarn add @airstack/frames

{% endtab %}

{% tab title="pnpm" %}

pnpm install @airstack/frames

{% endtab %}

{% tab title="bun" %}

bun install @airstack/frames

{% endtab %} {% endtabs %}

Check User's Farcaster Followers Count

You can use the allowListFramesjsMiddleware to check if a user has certain number of followers by using the NUMBER_OF_FARCASTER_FOLLOWERS and specifying the criteria using one of the comparison operator offered by Airstack:

{% tabs %} {% tab title="TypeScript" %}

import { createFrames, Button } from "frames.js/next";
import {
  AllowListCriteriaEnum as AllowListCriteria,
  allowListFramesjsMiddleware as allowList,
} from "@airstack/frames";

const frames = createFrames();

const handleRequest = frames(
  async (ctx) => {
    // Use `ctx.isAllowed` to check if user is allowed or not
    // based on the Farcaster followers count
    console.log(ctx.isAllowed);
    return {
      image: (<div></div>),
      buttons: [],
    };
  },
  {
    middleware: [
      // Allow List Middleware
      allowList({
        apiKey: process.env.AIRSTACK_API_KEY as string,
        criteria: {
          or: [
            // Only allow those with greater than 100 followers
            [AllowListCriteria.NUMBER_OF_FARCASTER_FOLLOWERS, { _gte: 100 }],
          ],
        },
      }),
    ],
  }
);

{% endtab %}

{% tab title="JavaScript" %}

const { createFrames, Button } = require("frames.js/next");
const {
  type AllowListCriteriaEnum as AllowListCriteria,
  allowListFramesjsMiddleware as allowList,
} = require("@airstack/frames");

const frames = createFrames();

const handleRequest = frames(
  async (ctx) => {
    // Use `ctx.isAllowed` to check if user is allowed or not
    // based on the Farcaster followers count
    console.log(ctx.isAllowed);
    return {
      image: (<div></div>),
      buttons: [],
    };
  },
  {
    middleware: [
      // Allow List Middleware
      allowList({
        apiKey: process.env.AIRSTACK_API_KEY,
        criteria: {
          or: [
            // Only allow those with greater than 100 followers
            [AllowListCriteria.NUMBER_OF_FARCASTER_FOLLOWERS, { _gte: 100 }],
          ],
        },
      }),
    ],
  }
);

{% endtab %}

{% tab title="Response" %}

true

{% endtab %} {% endtabs %}

Check If User Is Followed By Certain Farcaster User

You can use the allowListFramesjsMiddleware to check if a user is followed by a certain Farcaster user by using the FARCASTER_FOLLOWED_BY and specifying the fid of that certain Farcaster user:

{% tabs %} {% tab title="TypeScript" %}

import { createFrames, Button } from "frames.js/next";
import {
  AllowListCriteriaEnum as AllowListCriteria,
  allowListFramesjsMiddleware as allowList,
} from "@airstack/frames";

const frames = createFrames();

const handleRequest = frames(
  async (ctx) => {
    // Use `ctx.isAllowed` to check if user is allowed or not
    // based on the Farcaster followers count
    console.log(ctx.isAllowed);
    return {
      image: (<div></div>),
      buttons: [],
    };
  },
  {
    middleware: [
      // Allow List Middleware
      allowList({
        apiKey: process.env.AIRSTACK_API_KEY as string,
        criteria: {
          or: [
            // Only allow those who are followed by fid 1
            [AllowListCriteria.FARCASTER_FOLLOWED_BY, { fid: 1 }],
          ],
        },
      }),
    ],
  }
);

{% endtab %}

{% tab title="JavaScript" %}

const { createFrames, Button } = require("frames.js/next");
const {
  type AllowListCriteriaEnum as AllowListCriteria,
  allowListFramesjsMiddleware as allowList,
} = require("@airstack/frames");

const frames = createFrames();

const handleRequest = frames(
  async (ctx) => {
    // Use `ctx.isAllowed` to check if user is allowed or not
    // based on the Farcaster followers count
    console.log(ctx.isAllowed);
    return {
      image: (<div></div>),
      buttons: [],
    };
  },
  {
    middleware: [
      // Allow List Middleware
      allowList({
        apiKey: process.env.AIRSTACK_API_KEY,
        criteria: {
          or: [
            // Only allow those who are followed by fid 1
            [AllowListCriteria.FARCASTER_FOLLOWED_BY, { fid: 1 }],
          ],
        },
      }),
    ],
  }
);

{% endtab %}

{% tab title="Response" %}

true

{% endtab %} {% endtabs %}

Check If User Is Following Certain Farcaster User

You can use the allowListFramesjsMiddleware to check if a user is following a certain Farcaster user by using the FARCASTER_FOLLOWED_BY and specifying the fid of that certain Farcaster user:

{% tabs %} {% tab title="TypeScript" %}

import { createFrames, Button } from "frames.js/next";
import {
  AllowListCriteriaEnum as AllowListCriteria,
  allowListFramesjsMiddleware as allowList,
} from "@airstack/frames";

const frames = createFrames();

const handleRequest = frames(
  async (ctx) => {
    // Use `ctx.isAllowed` to check if user is allowed or not
    // based on the Farcaster followers count
    console.log(ctx.isAllowed);
    return {
      image: (<div></div>),
      buttons: [],
    };
  },
  {
    middleware: [
      // Allow List Middleware
      allowList({
        apiKey: process.env.AIRSTACK_API_KEY as string,
        criteria: {
          or: [
            // Only allow those who are following fid 1
            [AllowListCriteria.FARCASTER_FOLLOWING, { fid: 1 }],
          ],
        },
      }),
    ],
  }
);

{% endtab %}

{% tab title="JavaScript" %}

const { createFrames, Button } = require("frames.js/next");
const {
  type AllowListCriteriaEnum as AllowListCriteria,
  allowListFramesjsMiddleware as allowList,
} = require("@airstack/frames");

const frames = createFrames();

const handleRequest = frames(
  async (ctx) => {
    // Use `ctx.isAllowed` to check if user is allowed or not
    // based on the Farcaster followers count
    console.log(ctx.isAllowed);
    return {
      image: (<div></div>),
      buttons: [],
    };
  },
  {
    middleware: [
      // Allow List Middleware
      allowList({
        apiKey: process.env.AIRSTACK_API_KEY,
        criteria: {
          or: [
            // Only allow those who are following fid 1
            [AllowListCriteria.FARCASTER_FOLLOWING, { fid: 1 }],
          ],
        },
      }),
    ],
  }
);

{% endtab %}

{% tab title="Response" %}

true

{% endtab %} {% endtabs %}

Check If User Is Following The Caster

You can use the allowListFramesjsMiddleware to check if a user is following the caster of the Frame by using the FARCASTER_FOLLOWING_CASTER:

{% tabs %} {% tab title="TypeScript" %}

import { createFrames, Button } from "frames.js/next";
import {
  AllowListCriteriaEnum as AllowListCriteria,
  allowListFramesjsMiddleware as allowList,
} from "@airstack/frames";

const frames = createFrames();

const handleRequest = frames(
  async (ctx) => {
    // Use `ctx.isAllowed` to check if user is allowed or not
    // based on the Farcaster followers count
    console.log(ctx.isAllowed);
    return {
      image: (<div></div>),
      buttons: [],
    };
  },
  {
    middleware: [
      // Allow List Middleware
      allowList({
        apiKey: process.env.AIRSTACK_API_KEY as string,
        criteria: {
          or: [
            // Only allow those who are following the caster
            [AllowListCriteria.FARCASTER_FOLLOWING_CASTER],
          ],
        },
      }),
    ],
  }
);

{% endtab %}

{% tab title="JavaScript" %}

const { createFrames, Button } = require("frames.js/next");
const {
  type AllowListCriteriaEnum as AllowListCriteria,
  allowListFramesjsMiddleware as allowList,
} = require("@airstack/frames");

const frames = createFrames();

const handleRequest = frames(
  async (ctx) => {
    // Use `ctx.isAllowed` to check if user is allowed or not
    // based on the Farcaster followers count
    console.log(ctx.isAllowed);
    return {
      image: (<div></div>),
      buttons: [],
    };
  },
  {
    middleware: [
      // Allow List Middleware
      allowList({
        apiKey: process.env.AIRSTACK_API_KEY,
        criteria: {
          or: [
            // Only allow those who are following the caster
            [AllowListCriteria.FARCASTER_FOLLOWING_CASTER],
          ],
        },
      }),
    ],
  }
);

{% endtab %}

{% tab title="Response" %}

true

{% endtab %} {% endtabs %}

Developer Support

If you have any questions or need help regarding building Farcaster Frames with Airstack Frames.js Middleware, please join our Airstack's Telegram group.

More Resources