Why shouldn't I use raw fetch() in the Umbraco backoffice?

Raw fetch calls do not automatically include the bearer token authentication required by Umbraco, which results in 401 Unauthorized errors for custom API calls.

Which libraries are used for client generation?

The skill uses @hey-api/openapi-ts and @hey-api/client-fetch to generate a robust TypeScript SDK from your Swagger specification.

How is authentication handled in the generated client?

The client is configured within the Umbraco entry point to consume UMB_AUTH_CONTEXT, which provides the necessary credentials and bearer tokens automatically.

Does this skill help with the C# backend setup?

Yes, it provides a standardized pattern for using Composers and SwaggerGenOptions to correctly expose your custom APIs via Swagger.

Umbraco OpenAPI Client Setup

Name: Umbraco OpenAPI Client Setup
Author: umbraco

byumbraco

•

Content Management

Configures and generates type-safe, authenticated OpenAPI clients for Umbraco backoffice extensions to ensure secure API communication.

This skill streamlines the integration of custom C# APIs with the Umbraco backoffice frontend by automating the setup of a generated OpenAPI client. It solves the critical challenge of handling Umbraco's bearer token authentication, preventing common 401 Unauthorized errors that occur with raw fetch calls. By leveraging @hey-api/openapi-ts and Umbraco's internal authentication context, this skill provides developers with a production-ready pattern for building secure, type-safe communication layers between backend C# controllers and the TypeScript-based backoffice UI.

Key Features

01Pre-configured generation scripts for rapid development workflows

02Full TypeScript type safety for all API requests and response models

031 GitHub stars

04Automated OpenAPI client generation from Swagger definitions

05Seamless integration with Umbraco's UMB_AUTH_CONTEXT for bearer tokens

06Standardized patterns for C# Swagger/OpenAPI backend documentation

Use Cases

01Implementing secure frontend-to-backend communication in Umbraco CMS extensions

02Calling custom C# API controllers from a custom Umbraco backoffice dashboard

03Populating Umbraco trees and workspaces with data from custom endpoints

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add umbraco/umbraco-cms-backoffice-skills umbraco-openapi-client

For use in Claude.ai and ChatGPT

Download Skill