Event Livestream

If you have livestreaming enabled on an indexer for one of your projects (check the 'Stream Enabled' box in project settings: https://docs.graffle.io/graffle-docs/graffle-management-dashboard/projects/project-indexers), you can stream events in real time to your frontend. This is best used when you want to show live events on your site, without polling the Event Search API or your own API.

Note: You can contact us on our discord for an API key.

To get started, install the livestream SDK by running:

npm install @graffle/flow-livestream-sdk  

Then configure the SDK with your project Id and API key, and whether this is a test net project.

const clientConfig = {
    projectId: '<your project id>',
    apiKey: '<your api key>'
  };

const streamSDK = new GraffleSDK(clientConfig);
// or `const streamSDK = new GraffleSDK(clientConfig, true);` for test net

Then, create a function to display/process events as they come in and pass this function to the SDK via the stream method.

const displayEvent = (message) => {
    console.log(message);
    //display/process the event here
  };

  useEffect(() => {
    streamSDK.stream(displayEvent);
  }, []);

To disconnect and stop receiving events, call the disconnect method

streamSDK.disconnect();

Last updated