Upload Files

Upload images and documents to the media library.

Updated March 29, 2026

On this page

Overview

Upload files (images, documents) to the DashForDevs CDN. Uploaded files get a permanent URL for use in products, blog posts, reviews, and more.

SDK Usage

typescript

import dash from "@/lib/dash"

// Upload single file
const { success, url, filename, size } = await dash.upload.file(fileObject, {
  onProgress: (percent) => console.log(`${percent}% uploaded`),
})

// Upload multiple files
const results = await dash.upload.files([file1, file2, file3], {
  onFileProgress: (index, percent) => console.log(`File ${index}: ${percent}%`),
  onOverallProgress: (percent) => console.log(`Overall: ${percent}%`),
})

typescript

// Check if a file is allowed
const { allowed, reason } = await dash.upload.isAllowed("photo.jpg")

// Get full list
const allowed = await dash.upload.getAllowedExtensions()
// ["jpg", "jpeg", "png", "gif", "webp", "pdf", ...]

const blocked = await dash.upload.getBlockedExtensions()
// ["exe", "bat", "cmd", ...]

typescript

"use client"
import { useState } from "react"
import dash from "@/lib/dash"

export function FileUploader({ onUploaded }) {
  const [uploading, setUploading] = useState(false)
  const [progress, setProgress] = useState(0)

  async function handleChange(e) {
    const file = e.target.files[0]
    if (!file) return

    setUploading(true)
    const { url } = await dash.upload.file(file, {
      onProgress: setProgress,
    })
    setUploading(false)
    onUploaded(url)
  }

  return (
    <div>
      <input type="file" onChange={handleChange} disabled={uploading} />
      {uploading && <p>Uploading... {progress}%</p>}
    </div>
  )
}

Upload Files

Upload Files

Overview

SDK Usage

Check Allowed File Types

File Upload Component

REST API

Next Steps