Function getThumborUrl

Generates a Thumbor-processed image URL with specified dimensions and quality settings.

This function creates optimized image URLs for responsive images throughout the application. It uses smart cropping to maintain the focal point of images when resizing, and supports modern image formats like WebP for better performance.

The function connects to the ICJIA Thumbor service using a security key from environment variables to generate signed URLs that prevent unauthorized image manipulation.

Example

// Generate a thumbnail image
const thumbnailUrl = getThumborUrl({
  url: 'https://sfs.icjia.illinois.gov/splash-01.jpg',
  width: 300,
  height: 200,
  quality: 60,
  format: 'webp'
})

Example

// Use default values for most parameters
const defaultUrl = getThumborUrl({
  url: 'https://sfs.icjia.illinois.gov/hero-image.jpg'
})
// Returns 1024x768 WebP image at 80% quality
  • getThumborUrl(
        params: {
            url?: string;
            width?: number;
            height?: number;
            quality?: number;
            format?: string;
        },
    ): string

    Parameters

    • params: {
          url?: string;
          width?: number;
          height?: number;
          quality?: number;
          format?: string;
      }

      Image processing parameters

      • Optionalurl?: string

        Source image URL to process

      • Optionalwidth?: number

        Target width in pixels

      • Optionalheight?: number

        Target height in pixels

      • Optionalquality?: number

        Image quality (0-100, higher is better quality but larger file size)

      • Optionalformat?: string

        Output image format (e.g., "webp", "jpeg", "png")

    Returns string

    Signed Thumbor URL for the processed image

Settings

Member Visibility