Handle Backend Events

In this guide, you will learn how to handle backend events in the frontend of your Caido plugin.

This can be accomplished using the three event handlers provided by the SDK:

Listening for Project Changes

An event will be triggered when the active Project changes.

/packages/backend/src/index.ts

import type { DefineAPI, SDK } from "caido:plugin";

export type API = DefineAPI<{}>;

let previousProject: string | null = null;

export function init(sdk: SDK<API>) {
  sdk.events.onProjectChange((sdk, project) => {
    const newProjectName = project?.getName() ?? null;
    sdk.console.log(`Project changed from "${previousProject}" to "${newProjectName}."`);
    previousProject = newProjectName;
  });
}

The Result

Project changed from "Caido" to "Example".

Intercepting Requests and Responses

An event will be triggered with onInterceptRequest and onInterceptResponse when a request or response is proxied through Caido respectively.

/packages/backend/src/index.ts

import type { DefineAPI, SDK } from "caido:plugin";
import type { Request, Response } from "caido:utils";

export type API = DefineAPI<{}>;

export function init(sdk: SDK<API>) {
  sdk.events.onInterceptRequest((sdk, request: Request) => {
    sdk.console.log(`Intercepted ${request.getMethod()} request to ${request.getUrl()}`);
  });

  sdk.events.onInterceptResponse((sdk, request: Request, response: Response) => {
    sdk.console.log(`Intercepted response from ${request.getUrl()} with status ${response.getCode()}`);
  });
}

The Result

Intercepted GET request to https://example.com/path
Intercepted response from https://example.com/path with status 304