Backstage Harness Service Reliability Management Plugin

Harness Service Reliability Management helps teams track service level objectives and error budgets. It measures service health and ties changes to impact. It gives developers a shared view of reliability while they work.

The Backstage plugin brings SRM data into your service pages. It maps a Backstage service to a Harness project. You can see the monitored services that match that component. You get health scores, recent changes, and the SLOs that matter. Check burn rate, targets, and budget remaining at a glance. The information lives next to your docs and builds so you do not need to switch tools.

Common use cases include release readiness checks and steady state tracking. Before a deploy, confirm the SLO is healthy and the budget is safe. During an incident, open the service page to review recent changes and error budget burn. After a fix, watch the score recover and share status with your team. It keeps reliability work visible to the people who own the service.

Step 1 Add the frontend package

Run these in the root of your Backstage app

Copy

yarn add --cwd packages/app @harnessio/backstage-plugin-harness-srm
yarn install

Step 2 Configure the proxy for Harness

Add a proxy entry in app-config.yaml. Use a Personal Access Token or Service Account Token in the header x-api-key. Replace the value with your token. Use your on prem base URL in target if you do not use the cloud host

Copy

# app-config.yaml

proxy:
  '/harness':
    target: 'https://app.harness.io/'
    headers:
      'x-api-key': '<YOUR_PAT_OR_SAT>'

Optional base URL override

Copy

# app-config.yaml

harness:
  baseUrl: https://app.harness.io/

Step 3 Add the SRM tab to the service entity page

Edit packages/app/src/components/catalog/EntityPage.tsx. Import the SRM components. Add a route so the tab shows up on each service page. The tab only renders content for entities with the Harness annotation

Copy

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

import React from 'react';
import { Button } from '@material-ui/core';
import { EmptyState } from '@backstage/core-components';
import { EntityLayout, EntitySwitch } from '@backstage/plugin-catalog';
import {
  EntityHarnessSrmContent,
  isHarnessSRMAvailable,
} from '@harnessio/backstage-plugin-harness-srm';

const srmContent = (
  <EntitySwitch>
    <EntitySwitch.Case if={isHarnessSRMAvailable}>
      <EntityHarnessSrmContent />
    </EntitySwitch.Case>

    <EntitySwitch.Case>
      <EmptyState
        title="No SRM available for this entity"
        missing="info"
        description="You need to add an annotation to your component if you want to enable SRM for it. You can read more about annotations in Backstage by clicking the button below."
        action={
          <Button
            variant="contained"
            color="primary"
            href="https://backstage.io/docs/features/software-catalog/well-known-annotations"
          >
            Read more
          </Button>
        }
      />
    </EntitySwitch.Case>
  </EntitySwitch>
);

export const serviceEntityPage = (
  <EntityLayout>
    {/* other tabs */}
    <EntityLayout.Route path="/srm" title="Service Reliability">
      {srmContent}
    </EntityLayout.Route>
  </EntityLayout>
);

If your EntityPage is structured differently, place the route in your service layout so it renders in the service view

Step 4 Add annotations to your services

Add the Harness annotation to each service that should show SRM data. Point each label to a Harness Monitored Service URL

Copy

# catalog-info.yaml for a service

apiVersion: backstage.io/v1alpha1
kind: Component
metadata:
  name: my-service
  annotations:
    harness.io/services: |
      labelA: https://app.harness.io/ng/#/account/<acc>/cv/orgs/<org>/projects/<proj>/monitored-services/<identifier>
spec:
  type: service
  owner: team-a
  lifecycle: production

You can list more than one label under harness.io/services if needed

Notes on access and hosts

The token in x-api-key must have access to the Harness resources you want to read
Use your on prem Harness URL in the proxy target if you run Harness on prem

Backstage Harness Service Reliability Management Plugin

Installation Instructions

Step 1 Add the frontend package

Step 2 Configure the proxy for Harness

Step 3 Add the SRM tab to the service entity page

Step 4 Add annotations to your services

Notes on access and hosts

Changelog

Set up Backstage in minutes with Roadie