TypeScript icon, indicating that this package has built-in type declarations

3.38.1Β β€’Β PublicΒ β€’Β Published

Migrated to: @bytescale/upload-widget-jquery

jQuery File Upload Widget
(With Integrated Cloud Storage)

Twitter URL

Get Started β€” Try on CodePen

Upload Widget Demo

100% Serverless File Upload Widget
Powered by Bytescale

DMCA Compliant β€’ GDPR Compliant β€’ 99.9% Uptime SLA
Supports: Rate Limiting, Volume Limiting, File Size & Type Limiting, JWT Auth, and more...


Install via NPM:

npm install jquery @upload-io/jquery-uploader

Or via YARN:

yarn add jquery @upload-io/jquery-uploader

Or via a <script> tag:

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://js.bytescale.com/jquery-uploader/v3"></script>


Step 1) Initialize the uploader plugin

Call this once only β€” at the start of your app β€” before calling $(x).uploader().

// Get production-ready API keys from Bytescale
  apiKey: "free"

Step 2) Display the Upload Widget

To display a file upload dialog on click β€” Try on CodePen

$(() => {
    onComplete: files => {
      if (files.length === 0) {
        console.log('No files selected.')
      } else {
        console.log('Files uploaded:');
        console.log(files.map(f => f.fileUrl));

To display a file upload dropzone inline on the page β€” Try on CodePen

$(() => {
    dropzone: {
      width: "600px",
      height: "375px"
    onUpdate: files => {
      if (files.length === 0) {
        console.log('No files selected.')
      } else {
        console.log('Files uploaded:');
        console.log(files.map(f => f.fileUrl));

The Result

All callbacks receive an Array<UploadWidgetResult>:

  fileUrl: "https://upcdn.io/FW25...",   // URL to use when serving this file.
  filePath: "/uploads/example.jpg",      // File path (we recommend saving this to your database).

  editedFile: undefined,                 // Edited file (for image crops). Same structure as below.

  originalFile: {
    fileUrl: "https://upcdn.io/FW25...", // Uploaded file URL.
    filePath: "/uploads/example.jpg",    // Uploaded file path (relative to your raw file directory).
    accountId: "FW251aX",                // Bytescale account the file was uploaded to.
    originalFileName: "example.jpg",     // Original file name from the user's machine.
    file: { ... },                       // Original DOM file object from the <input> element.
    size: 12345,                         // File size in bytes.
    lastModified: 1663410542397,         // Epoch timestamp of when the file was uploaded or updated.
    mime: "image/jpeg",                  // File MIME type.
    metadata: {
      ...                                // User-provided JSON object.
    tags: [
      "tag1",                            // User-provided & auto-generated tags.

🌐 API Support

🌐 File Management API

Bytescale provides an Upload API, which supports the following:

  • File uploading.
  • File listing.
  • File deleting.
  • And more...

Uploading a "Hello World" text file is as simple as:

curl --data "Hello World" \
     -u apikey:free \
     -X POST "https://api.bytescale.com/v1/files/basic"

Note: Remember to set -H "Content-Type: mime/type" when uploading other file types!

Read the Upload API docs Β»

🌐 Image Processing API (Resize, Crop, etc.)

Bytescale also provides an Image Processing API, which supports the following:

Read the Image Processing API docs Β»

Original Image

Here's an example using a photo of Chicago:


Processed Image

Using the Image Processing API, you can produce this image:


Full Documentation

Uploader Documentation Β»

Need a Headless (no UI) File Upload Library?

Try Upload.js Β»

Can I use my own storage?

Yes: Bytescale supports AWS S3, Cloudflare R2, Google Storage, and DigitalOcean Spaces.

To configure a custom storage backend, please see:


πŸ‘‹ Create your Bytescale Account

jQuery Uploader is the jQuery Upload Widget for Bytescale: the best way to serve images, videos, and audio for web apps.

Create a Bytescale account Β»

Building From Source




Package Sidebar


npm i @upload-io/jquery-uploader

Weekly Downloads






Unpacked Size

33.1 kB

Total Files


Last publish


  • upload-io