Files
A product page links to a data sheet. A footer links to a price list. A configurator loads a 3D model. None of these is something a media field displays: the editor uploads the file, and the storefront links to it.
The Laioutr CDN stores such files in the same project bucket as images and video and delivers them from the same hostname, with the same edge cache.
Two kinds of upload
| Kind | Examples | In Studio |
|---|---|---|
| Media | Images, MP4 video, audio | A media field can select it. Audio plays in the browser's own player. |
| Distribution file | PDF, spreadsheets, documents, archives, 3D models | A media field cannot select it. It is delivered by URL. |
An upload is media when a current browser renders it in an image, video or audio element. Everything else is a file, including an image type no browser displays, such as a Photoshop document.
Editors upload files of both kinds on the project's Media page, and filter its list by type. The picker of a media field shows and uploads media only, limited to the kinds the field allows.
The file URL
https://{projectId}.cdn.laioutr.cloud/{key}/{name}.{ext}
{key} is minted once for the upload and never reused. {name}.{ext} is the asset's name with the extension of its type. It is there so the browser saves the file under a readable name; the CDN ignores it when it looks the object up.
The download name follows the asset's name at the time the URL is built. Renaming an asset gives a new URL. The old URL keeps working and delivers the same bytes.
Add ?download to make the browser save the file instead of opening it:
https://{projectId}.cdn.laioutr.cloud/{key}/{name}.pdf?download
A file is served like any other object on the host: cache-control: public, max-age=31536000, immutable on success, and X-Content-Type-Options: nosniff.
Accepted types
| Group | Types |
|---|---|
| Images | PNG, JPEG, WebP, AVIF, GIF, SVG |
| Video | MP4 |
| Audio | MP3, M4A, AAC, Ogg, WAV, FLAC |
| Documents | PDF, Word (.docx, .doc), Excel (.xlsx, .xls), PowerPoint (.pptx, .ppt), plain text, CSV, JSON |
| Other | ZIP, Photoshop (.psd), glTF binary (.glb), glTF (.gltf) |
The type names some browsers report instead of the standard one are accepted too: audio/x-m4a, audio/x-flac and application/x-zip-compressed.
Markup, scripts and executables are not accepted. The delivery host would serve them under the CDN's own origin.
.glb, not .gltf. A .gltf usually refers to separate files for its buffers and textures, and the library stores one file, so the model would load without them.Limits
| Constraint | Value | What happens |
|---|---|---|
| File size | 100 MB | The file is refused with too_large. |
| Empty file | 1 byte at least | The upload is refused when the targets are requested. |
| Type | The list above | The file is refused with unsupported_type. |
A refused file rejects the batch it was part of when the upload targets are requested. Video has its own envelope; see Video CDN.
The byte check
The CDN serves each file under the type declared at upload and tells browsers not to guess another one, so a file whose content differs from its declared type is still handled as the declared type. When an upload is finalized, the CDN therefore reads the first bytes of the stored object and refuses only content that is an executable or an installer, whatever type it was declared as: Windows, Linux and macOS executables, packages such as .deb, .rpm, .apk and .jar, shortcuts, and macro-enabled Office files. The object is deleted and the file comes back as unsupported_type.
An MSI installer cannot be told apart from an old Office document, so it passes.
Connecting a library of your own
A media-library connector returns files as items of their own kind, and filters by type. See Media Libraries.
Video CDN
How the Laioutr CDN stores, transforms, and delivers video, what the upload envelope allows, how adaptive HLS and DASH delivery works, and which seams let you put a third-party video provider behind the same storefront components.
Checkout
Overview of Laioutr’s composable checkout library and how it connects to your ecommerce backend and payment providers.