Skip to content

Image Processing API

SkyCMS provides server-side image processing for generating thumbnails on demand. The File Manager uses this to display image previews, and the API is available to any authenticated user with file access.

Audience: Developers, Editors

Thumbnail Endpoint

GET /FileManager/GetImageThumbnail

Generates a thumbnail for any image stored in blob storage.

Parameters

Parameter Type Default Description
target string — Path to the source image in blob storage
width int 120 Desired width in pixels
height int 120 Desired height in pixels

Response

  • Content-Type: image/webp
  • Body: WebP-encoded thumbnail image

Supported Input Formats

Extension MIME Type
.png image/png
.jpg image/jpeg
.jpeg image/jpeg
.gif image/gif
.webp image/webp

Unsupported formats return a NotSupportedException.

Error Handling

  • Invalid dimensions (zero or negative) → 400 Bad Request
  • Unsupported file extension → Exception
  • File not found → Standard 404

Authorization

Requires one of: Administrator, Editor, Author, or Team Member role.

Processing Pipeline

The thumbnail generation follows this pipeline:

Request → Load from blob storage → Decode image → Resize (crop) → Encode as WebP → Response
  1. Storage read — The image is loaded from blob storage via IStorageContext.GetStreamAsync().
  2. Decode — SixLabors.ImageSharp decodes the image from the stream.
  3. Resize — The image is resized using crop mode, anchored at center, to the exact requested dimensions.
  4. Encode — The result is encoded as WebP for optimal file size.

Resize Modes

The thumbnail endpoint uses crop mode — the image is resized to fill the requested dimensions and excess is cropped from the edges (centered). This produces consistently-sized thumbnails regardless of the source aspect ratio.

Image Processing Services

ThumbnailCreator

The ThumbnailCreator service provides two methods for generating thumbnails:

Method Behavior
Create(stream, size, contentType) Resize preserving aspect ratio (may not fill target dimensions)
CreateFill(stream, size, contentType) Resize to fill target dimensions exactly (crops excess)

Both methods use high-quality rendering settings:

  • Compositing: SourceCopy
  • Quality: HighQuality
  • Smoothing: AntiAlias
  • Interpolation: HighQualityBicubic

ImageResizer

The ImageResizer service calculates new dimensions while preserving aspect ratio:

  • Takes the original and target dimensions.
  • Calculates the scaling factor to fit within the target.
  • Enforces a minimum of 1 pixel per dimension.
  • Default thumbnail size: 80×80 pixels.

File Manager Integration

The File Manager UI uses the thumbnail endpoint to display image previews in the file browser. When a folder is opened:

  1. The file list is loaded from blob storage.
  2. For each image file, the browser requests a thumbnail via the API.
  3. Thumbnails are displayed inline in the file list.

The File Manager supports:

  • Browsing directories in blob storage.
  • Uploading files with drag-and-drop.
  • Previewing images with on-demand thumbnail generation.
  • Managing files (rename, delete, move).

Multi-Tenancy

  • Blob storage access is scoped to the current tenant.
  • Thumbnails are generated on-the-fly from tenant-specific storage.
  • No cross-tenant file access is possible.

See Also