Playground API
DocsStatsBlogStudio
Documentation Tree
Technical BlogFeature Deep Dives
  • Introduction
  • Quickstart
    5 min
  • How It Works
  • Recipes & Cookbooks
  • Platform Comparisons
  • Real-World Showcase
  • Interactive Studio
    Studio
  • GraphiQL IDE
    IDE
  • Session Quotas & Activity
  • Network Chaos Simulator
  • Atomic Sandbox Reset
  • Overview & Models
    Hub
  • Users Resource
  • Posts Resource
  • Comments Resource
  • Todos Resource
  • Custom Collections
    Custom
  • Multipart File Uploads
    Upload
  • Dynamic SVG Avatars
    SVG
  • Image Thumbnails
    CDN
  • Relational Filtering
  • Full-Text Search
  • Dynamic Sorting
  • Offset Pagination
  • Cursor Pagination
    Scroll
  • CSV & Excel Export & Import
    IO
  • Custom Collections
    CRUD
  • Overview & Architecture
    Hub
  • JWT Auth Flow
  • Refresh Token Rotation
    Mutex
  • RBAC Permission Matrix
    Roles
  • Expiry Simulation
  • Clock Skew Drift
  • Password Recovery Loop
  • Dual-Mode Sandboxing
  • GraphiQL IDE
    IDE
  • Relational Queries
  • Stateful Mutations
  • Realtime Subscriptions
  • Overview & Flowcharts
    Hub
  • Hosted Checkout
    Stripe
  • Payment Intents API
  • 3DS Challenge Modal
    Modal
  • Customers Vault
  • Charges & Refunds
  • Test Cards Catalog
  • Overview & Channels
    Hub
  • Virtual Email Mailbox
    Mailtrap
  • Virtual SMS Terminal
    Phone
  • In-App Notifications
  • Message Dispatcher
  • Realtime Studio
    Studio
  • Native WebSocket (/ws)
  • Socket.io Gateway
  • Presence & Echo Bot
  • Server-Sent Events (SSE)
    SSE
  • Analytics Telemetry
  • Webhook Subscriptions
  • HMAC SHA-256 Signatures
  • Delivery Logs
  • Manual Retry Simulator
  • Network Latency Delay
  • HTTP Status Codes
  • Rate-Limit Simulator
    429
  • Flaky Network & Jitter
    Chaos
  • Session Quotas & Activity
  • JSON Snapshots
    JSON
  • Headless CI/CD Testing
    CI
  • Mobile QR Code Sync
  • System Metrics & Health
  • Atomic Sandbox Reset
  • Official TypeScript SDK
  • Multi-Language Generators
  • DevTools Extension
  • OpenAPI 3.1 Spec
    JSON
  • Postman Collection v2.1
  • Bruno Collection
  • Insomnia Workspace
  • TypeScript .d.ts
    .d.ts
  • AI Prompt Rules
    Rules
  • Context Index (llms.txt)
  • Full Schema (llms-full.txt)
  • Manifest (product.json)
  • All Feature Articles
    Blog
  • React CRUD Without Backend
    Deep Dive
  • Why Static APIs Fail
  • Mocking Stateful Auth
  • WebSockets & SSE Guide
Technical Blog
Articles

In-depth articles explaining stateful mock APIs, WebSockets, payments, and frontend resilience.

Read Articles
PreviousCustom Collections
NextDynamic SVG Avatars
Media & Binary Assets

Multipart File Uploads & Cloud Storage

An enterprise-grade media ingestion pipeline supporting single and bulk multipart/form-data submissions, binary magic bytes integrity validation, Cloudinary CDN delivery with auto-generated metadata, and real-time SSE broadcasts.

Magic Bytes Signature VerificationCloudinary CDN & DimensionsReal-time SSE file.uploaded Event5MB Single / 15 Session File Quota

Interactive Upload Sandbox

Select or drop real files to test the live upload pipeline against your isolated visitor sandbox.

Drag & drop an image, document, or PDF here

Or click to browse from your device. Max file size: 5 MB.

Executables (.exe, .sh) and scripts (.js, .php) are automatically blocked.

Session File Vault & CDN Explorer

0 / 15 files

Live items persisted in your visitor overlay sandbox. Queryable via GET /api/v1/uploads.

Sandbox Session Quota0 of 15 max active files

No uploaded files in this category

Use the live upload sandbox above to upload an image, document, or PDF to see it appear here instantly.

Interactive Uploads API Consoles

Query, inspect, and delete media files directly against the running API endpoint:

List Session Uploaded Files

Fetches all active uploaded records in your isolated visitor sandbox with filtering.

GET
response.json
1
{
2
// Click "Send" above to execute this request against the live server.
3
}

Filter Uploads by Category

Query uploaded files restricted to a specific category (avatars, documents, products, general).

GET
response.json
1
{
2
// Click "Send" above to execute this request against the live server.
3
}

Security Architecture & Magic Byte Inspection

How Playground API protects sandboxes from disguised malware, webshells, and arbitrary code execution.

Binary Magic Byte Inspection

Playground API does not rely solely on user-supplied Content-Type headers or file extensions. Before saving, the backend inspects the binary buffer's leading bytes to verify authentic file signatures:

TypeMagic Signature (Hex / ASCII)
JPEG / JPGFF D8 FF
PNG89 50 4E 47
GIF47 49 46 38
PDF25 50 44 46 (%PDF)
WebPRIFF .... WEBP

Prohibited Executable Signatures

Files containing executable headers (Windows PE 4D5A, Linux ELF 7F454C46, or macOS Mach-O FEEDFACE) disguised as images or documents are rejected immediately with HTTP 415 PROHIBITED_FILE_TYPE.

Blocked Script & Binary Extensions:

exe, bat, cmd, sh, bash, php, phtml, js, mjs, ts, py, pyc, rb, pl, jsp, asp, aspx, vbs, dll, so, wasm, jar, html, htm, msi

Validation Error Status Codes

413 FILE_TOO_LARGE

Triggered if single file payload exceeds 5 MB.

415 PROHIBITED_TYPE

Disguised executable or banned script extension.

429 QUOTA_EXCEEDED

Session sandbox limit reached (15 active files max).

400 TOO_MANY_FILES

Bulk batch payload exceeded 10 items limit.

Production Client Integration Recipes

Drop-in examples for browser FormData, Axios progress listeners, Python scripts, and cURL:

1
// Modern TypeScript Native Fetch with FormData
2
async function uploadAsset(file: File, category = 'general', tags: string[] = []) {
3
const formData = new FormData();
4
formData.append('file', file);
5
formData.append('category', category);
6
formData.append('description', 'User uploaded asset from web app');
7
formData.append('tags', tags.join(','));
8
9
const response = await fetch('https://playground.nileslabs.com/api/v1/uploads', {
10
method: 'POST',
11
credentials: 'include', // Includes visitor sandbox session cookie
12
body: formData,
13
});
14
15
if (!response.ok) {
16
const errorData = await response.json();
17
throw new Error(Upload failed (${response.status}): ${errorData.error});
18
}
19
20
const { file: uploadedRecord } = await response.json();
21
console.log('Uploaded successfully:', uploadedRecord.secure_url);
22
return uploadedRecord;
23
}
Next in Media

Deterministic SVG Avatars

Generate crisp, zero-dependency vector avatars from user handles, names, or emails with 12 gradient palettes.

Related

Landscape Thumbnails & CDN Transforms

Create mesh-gradient placeholder thumbnails with custom text and aspect ratios.