πŸ–ΌοΈLens Profile Image

Learn how to use Airstack API to fetch Lens profile image data in various sizes.

Airstack provides easy-to-use APIs for enriching Lens applications and integrating on-chain and off-chain data with Lens.

In this guide you will learn how to use Airstack to get Lens profile image in various sizes.

Pre-requisites

  • An Airstack account

  • Basic knowledge of GraphQL

Get Started

JavaScript/TypeScript/Python

If you are using JavaScript/TypeScript or Python, Install the Airstack SDK:

React

npm install @airstack/airstack-react

Node

npm install @airstack/node

Then, add the following snippets to your code:

import { init, useQuery } from "@airstack/airstack-react";

init("YOUR_AIRSTACK_API_KEY");

const query = `YOUR_QUERY`; // Replace with GraphQL Query

const Component = () => {
  const { data, loading, error } = useQuery(query);

  if (data) {
    return <p>Data: {JSON.stringify(data)}</p>;
  }

  if (loading) {
    return <p>Loading...</p>;
  }

  if (error) {
    return <p>Error: {error.message}</p>;
  }
};

Other Programming Languages

To access the Airstack APIs in other languages, you can use https://api.airstack.xyz/gql as your GraphQL endpoint.

πŸ€– AI Natural Language​

Airstack provides an AI solution for you to build GraphQL queries to fulfill your use case easily. You can find the AI prompt of each query in the demo's caption or title for yourself to try.

Get Lens Profile Image

You can provide the Lens handle, e.g. lens/@vitalik, into the profileName input filter and fetch the Lens profile image from the response with the profileImage giving the original profile image and profileImageContentValue providing the resized versions:

The images returned will already be resized by Airstack and can be used directly within your application:

  • extra_small: 125x125px

  • small: 250x250px

  • medium: 500x500px

  • large: 750x750px

Try Demo

Code

query MyQuery {
  Socials(
    input: {
      filter: { profileName: { _eq: "lens/@vitalik" }, dappName: { _eq: lens } }
      blockchain: ethereum
    }
  ) {
    Social {
      profileImage
      profileImageContentValue {
        image {
          extraSmall
          large
          medium
          original
          small
        }
      }
    }
  }
}

Developer Support

If you have any questions or need help regarding fetching Lens profile images data, please join our Airstack's Telegram group.

More Resources

Last updated

Was this helpful?