JavaScript

Learn how to setup the framework-agnostic JavaScript API client.

To get started with the Lens JavaScript SDK, follow these steps:

npm install @lens-protocol/client@latest

import { LensClient, development } from "@lens-protocol/client";
const client = new LensClient({  environment: development,});

By default, LensClient uses in-memory storage for the authenticated session, which is lost when the current thread closes, like when refreshing a page in a browser. To keep the session persistent, you can supply a long-term storage solution to the LensClient constructor.

In a browser, for instance, you can use a Web Storage API like window.localStorage:

import { LensClient, production } from "@lens-protocol/client";
const client = new LensClient({  environment: production
  storage: window.localStorage,});

You also have the option to create a custom storage solution by implementing the IStorageProvider interface. This allows you to tailor the storage provider to your specific needs and requirements.

The Lens SDKs are designed to seamlessly work together, allowing you to use multiple SDKs in the same application. Although we don't recommend it, we are aware that some use cases might require it.

In certain situations, you might want to use the LensClient alongside the Lens React SDK. For instance, if your app is built using the Lens React SDK but you need to use some experimental APIs currently only available through LensClient.

In such cases, instantiate a LensClient that inherits the authenticated session from your primary Lens React SDK integration. To achieve this, you can utilize the useStorage hook and instantiate the LensClient with the same storage provider, like this:

import { useMemo } from "react";import { LensClient, development } from "@lens-protocol/client";import { useStorage } from "@lens-protocol/react-web";
function Example() {  const storage = useStorage();  const client = useMemo(    () =>      new LensClient({        environment: development,        storage,      }),    [storage]  );
  // ...}

There are some circumstances where you might have the user's Refresh Token available and want to use it to authenticate the LensClient.

The client.authentication.authenticateWith method allows you to authenticate the LensClient with a Refresh Token:

import { LensClient, development } from "@lens-protocol/client";
const client = new LensClient({  environment: development,});
const refreshToken = "YOUR_VALID_REFRESH_TOKEN_HERE";await client.authentication.authenticateWith({ refreshToken });
console.log(  `Is LensClient authenticated? `,  await client.authentication.isAuthenticated() // true);

The Lens SDK repository contains a list of examples that you can use as a reference for your own application.

You can specify HTTP Headers to be included in all requests made by the LensClient.

const client = new LensClient({  environment: production,  headers: {    "x-secret": "...",  },});