Cloudinary

Using Cloudinary for asset delivery and transformation.

Cloudinary is a media management platform that provides optimized delivery, on-the-fly transformations, and powerful tooling for images, audio, video, and other documents. All assets exposed through the public API are stored in Cloudinary, and API consumers can retrieve and transform them directly using Cloudinary’s URL-based API.

Access to all assets is public. If you know the ID assigned by Directus, you can construct the Cloudinary URL and request the file without authentication.

Retrieving Assets

All assets use the following structure:

Cloud name: onderwijsin
Base folder: onderwijsloket-directus/production
Public ID format: onderwijsloket-directus/production/{ID assigned by Directus}

Use Cloudinary’s standard delivery URL format, without including a version segment:

https://res.cloudinary.com/onderwijsin/{asset_type}/upload/{public_id}

Where:

{asset_type} is typically image, video, or raw (for documents and other files).
{public_id} is onderwijsloket-directus/production/{ID assigned by Directus}.

Common transformations

Cloudinary supports on-the-fly transformations for images, video, and audio. Transformations are expressed as comma-separated parameters placed between the upload/ segment and the public ID. Multiple transformations can be combined in a single request. Some basic examples are given below.

Image Transformations

Resize and crop:
w_800,h_600,c_fill
Automatic format and quality:
f_auto,q_auto
Convert to WebP:
f_webp

Video Transformations

Resize:
w_1280
Trim video:
so_3,du_5
Convert format:
f_mp4

Audio Transformations

Convert to MP3:
f_mp3
Set bitrate:
br_128k
Set codec:
ac_aac

Integration Hints

Cloudinary provides SDKs and integrations for many common frameworks. Typical integration patterns include:

Client-side rendering with URL-based transformations (React, Vue, Next.js).
Server-side helpers for building transformation URLs (Node.js, PHP, Python, Ruby).
Automatic optimization via framework plugins (Next.js Image component, Nuxt modules).
Media players that accept Cloudinary URLs directly for audio and video streaming.

Since all assets are public and use predictable URLs, most integrations only require constructing the URL from the ID assigned by Directus and adding any desired transformations.