Sysdig logo

Backstage Sysdig Plugin

Created by Sysdig

Sysdig is a cloud security platform for containers and Kubernetes. It helps teams find vulnerabilities, spot misconfigurations, and detect threats using runtime intelligence. Many engineers already use Sysdig Secure to watch what runs in prod and to act on real risk.

This Backstage plugin brings that context into your service catalog. It adds a Sysdig view to your entities so you can see current vulnerabilities and posture findings next to docs, owners, and on call links. The plugin reads Backstage annotations to match a service to the right cluster, image, or cloud resource in Sysdig. You get a quick path from a component page to the evidence you need to triage or prove compliance. No tab hunting. No copy paste across tools.Typical use cases include checking the risk of a new release, tracking open issues from image scans, confirming a workload meets a policy, or reviewing posture for a team’s services before a deadline. This helps engineers focus on the fixes that matter and reduce context switching during reviews.

Installation Instructions

These instructions apply to self-hosted Backstage only.

Install the frontend package

From your Backstage root

Copy
yarn --cwd packages/app add @sysdig/backstage-plugin-sysdig

Add the Sysdig page to your entity view

Edit packages/app/src/components/catalog/EntityPage.tsx

Import the page

Copy
import { SysdigPage } from '@sysdig/backstage-plugin-sysdig';

Add a new tab route inside your service entity layout

Copy
// inside your existing service entity layout
// example snippet
import React from 'react';
import { EntityLayout } from '@backstage/plugin-catalog';

import { SysdigPage } from '@sysdig/backstage-plugin-sysdig';

export const serviceEntityPage = (
  <EntityLayout>
    {/* other tabs */}
    <EntityLayout.Route path="/sysdig" title="Sysdig">
      <SysdigPage />
    </EntityLayout.Route>
  </EntityLayout>
);

Make sure your app uses serviceEntityPage for Service kind entities. For example in the same file

Copy
// example usage
import { EntityKindPicker } from '@backstage/plugin-catalog-react';
// your existing routing that selects serviceEntityPage for services

Configure the proxy and plugin settings

Edit app-config.yaml

Provide your Sysdig Secure endpoint and API token through env vars. Then wire them to the proxy and to the plugin config.

Copy
proxy:
  endpoints:
    '/sysdig':
      target: ${SYSDIG_SECURE_ENDPOINT}
      changeOrigin: true
      allowedMethods: ['GET']
      headers:
        "Authorization": "Bearer ${SYSDIG_SECURE_TOKEN}"
        "Content-Type": "application/json"
        "Accept": "application/json"
        "X-Sysdig-Product": "SDS"

sysdig:
  endpoint: ${SYSDIG_SECURE_ENDPOINT}
  backlink: `https://your-sysdig-base-url/`  # optional must end with /

Set the env vars for your runtime

Copy
export SYSDIG_SECURE_ENDPOINT="https://your-sysdig-endpoint"
export SYSDIG_SECURE_TOKEN="your-sysdig-api-token"

Enable the proxy in the new Backstage backend system

If your backend uses the new backend system with createBackend

Add the proxy backend plugin

Copy
yarn --cwd packages/backend add @backstage/plugin-proxy-backend

Register the plugin in packages/backend/src/index.ts

Copy
import { createBackend } from '@backstage/backend-defaults';
import { proxyPlugin } from '@backstage/plugin-proxy-backend';

const backend = createBackend();
backend.add(proxyPlugin());
backend.start();

The plugin reads the proxy section you added in app-config.yaml. No extra code is needed.

Enable the proxy in the old Backstage backend system

If your backend uses the legacy setup with PluginEnvironment and an apiRouter

Add the proxy backend plugin

Copy
yarn --cwd packages/backend add @backstage/plugin-proxy-backend

Create packages/backend/src/plugins/proxy.ts

Copy
import { createRouter } from '@backstage/plugin-proxy-backend';
import { PluginEnvironment } from '../types';

export default async function createPlugin(env: PluginEnvironment) {
  return await createRouter({
    config: env.config,
    logger: env.logger,
  });
}

Wire it in packages/backend/src/index.ts

Copy
import proxy from './plugins/proxy';

// inside the function that builds your apiRouter
const proxyEnv = useHotMemoize(module, () => createEnv('proxy'));
apiRouter.use('/proxy', await proxy(proxyEnv));

The plugin reads the proxy section you added in app-config.yaml. No extra code is needed.

Add annotations to your entities

Add one or more of these annotations to each entity that should show Sysdig data. Pick only what you have data for. Missing values will simply omit related reports.

Copy
apiVersion: backstage.io/v1alpha1
kind: Component
metadata:
  name: sock-shop-carts
  annotations:
    sysdigcloud.com/kubernetes-cluster-name: sock-shop-cluster
    sysdigcloud.com/kubernetes-namespace-name: sock-shop
    sysdigcloud.com/kubernetes-workload-name: sock-shop-carts
    sysdigcloud.com/kubernetes-workload-type: deployment

    sysdigcloud.com/registry-vendor: harbor
    sysdigcloud.com/registry-name: registry-harbor-registry.registry.svc.cluster.local:5443

    sysdigcloud.com/image-freetext: ghcr.io/sysdiglabs

    sysdigcloud.com/resource-name: sock-shop-carts
    sysdigcloud.com/resource-type: "Deployment"
spec:
  type: service
  lifecycle: experimental
  owner: team-c

Where the page appears in the UI

Open a Service entity. You will see a Sysdig tab. The page reads the annotations on that entity and calls the Sysdig API through the proxy you configured.

Changelog

The Sysdig plugin has not seen any significant changes since a year ago.

Set up Backstage in minutes with Roadie