# blueimp/jquery-file-upload

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/blueimp-jquery-file-upload).**

30,748 stars · 7,775 forks · PHP · MIT · archived

## Links

- GitHub: https://github.com/blueimp/jQuery-File-Upload
- Homepage: https://blueimp.github.io/jQuery-File-Upload/
- awesome-repositories: https://awesome-repositories.com/repository/blueimp-jquery-file-upload.md

## Description

This project is a jQuery-based file upload widget that provides a browser interface for selecting and transferring files to a server. It functions as a chunked file uploader and a resumable upload client, enabling the transfer of large files by splitting them into smaller segments or continuing interrupted uploads from the last successfully sent byte.

The tool includes a client-side image processor for validating, resizing, and generating previews of images before transmission. It also serves as a cross-domain upload tool, using various transport mechanisms to send files to different domains and bypass origin restrictions.

The system covers a broad range of capabilities including web form file validation, the management of upload concurrency, and the integration of drag-and-drop or clipboard-paste inputs. It provides hooks for lifecycle management and the ability to monitor real-time upload progress via linked interface elements.

## Tags

### User Interface & Experience

- [File Uploaders](https://awesome-repositories.com/f/user-interface-experience/file-uploaders.md) — Provides a comprehensive jQuery-based widget for transferring files from a browser to a server. ([source](https://github.com/blueimp/jquery-file-upload#readme))
- [Image Resizing](https://awesome-repositories.com/f/user-interface-experience/data-display-components/content-cards/image-resizing.md) — Shrinks image dimensions on the user device before uploading to minimize bandwidth and server storage usage. ([source](https://github.com/blueimp/jquery-file-upload#readme))
- [Client-Side](https://awesome-repositories.com/f/user-interface-experience/data-display-components/content-cards/image-resizing/client-side.md) — Adjusts image dimensions in the browser before uploading to reduce bandwidth and storage requirements. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support))
- [Drag and Drop Libraries](https://awesome-repositories.com/f/user-interface-experience/drag-and-drop-libraries.md) — Initiates file uploads by allowing users to drag files from the desktop and drop them into the browser. ([source](https://github.com/blueimp/jquery-file-upload#readme))
- [Drag and Drop Utilities](https://awesome-repositories.com/f/user-interface-experience/drag-and-drop-utilities.md) — Defines specific interface elements as drop targets to accept and upload files dragged from the system. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Options))
- [Resumable Transfer Tracking](https://awesome-repositories.com/f/user-interface-experience/file-uploaders/asynchronous-uploaders/resumable-transfer-tracking.md) — Implements byte-offset tracking to continue interrupted transfers from the last successfully sent byte.
- [Image Previewers](https://awesome-repositories.com/f/user-interface-experience/content-display-components/image-previewers.md) — Displays visual thumbnails of selected images before they are transmitted to the server. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support))
- [File Previewers](https://awesome-repositories.com/f/user-interface-experience/file-previewers.md) — Creates visual or audio previews for supported file types locally before or after the upload completes. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Options))
- [Bulk File Selection](https://awesome-repositories.com/f/user-interface-experience/file-selection-interfaces/bulk-file-selection.md) — Supports picking several files at once or selecting entire folder structures for upload. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support))
- [File Validation Utilities](https://awesome-repositories.com/f/user-interface-experience/file-validation-utilities.md) — Enforces constraints on file extensions, minimum size, and maximum size on the client side.
- [Event-Driven Input Handlers](https://awesome-repositories.com/f/user-interface-experience/form-and-input-management/input-handling/event-driven-input-handlers.md) — Captures files from diverse sources including drag-and-drop and clipboard paste via event handlers.

### Part of an Awesome List

- [Chunked Uploaders](https://awesome-repositories.com/f/awesome-lists/devtools/file-upload/chunked-uploaders.md) — Splits large files into smaller segments to bypass server size limits and improve upload reliability.
- [Form Components](https://awesome-repositories.com/f/awesome-lists/devtools/form-components.md) — Advanced file upload widget with drag-and-drop support.

### Data & Databases

- [File Upload Management](https://awesome-repositories.com/f/data-databases/file-upload-management.md) — Manages the complete upload lifecycle, including custom logic for adding, sending, and completing uploads. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Options))
- [Transport Selection](https://awesome-repositories.com/f/data-databases/data-engineering-infrastructure/data-extraction-ingestion/file-upload-configurations/transport-selection.md) — Enables selection of data transmission methods like XHR or iframes to meet cross-site requirements. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Options))
- [Client-Side Metadata Extraction](https://awesome-repositories.com/f/data-databases/file-metadata-services/client-side-metadata-extraction.md) — Enables retrieval of detailed file information on the client side before the transfer process begins. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support))
- [Concurrency Controls](https://awesome-repositories.com/f/data-databases/file-upload-management/concurrency-controls.md) — Allows developers to control whether files upload sequentially or simultaneously with a defined concurrency limit. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Options))
- [Paste-to-Upload](https://awesome-repositories.com/f/data-databases/file-upload-management/paste-to-upload.md) — Uploads files by copying them to the clipboard and pasting them into a designated target element. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Options))

### DevOps & Infrastructure

- [File Uploaders](https://awesome-repositories.com/f/devops-infrastructure/file-uploaders.md) — Uploads large files in sequential pieces to avoid server timeouts or size restrictions. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Options))

### Networking & Communication

- [File Upload APIs](https://awesome-repositories.com/f/networking-communication/api-integration-frameworks/api-management-integration/api-integrations/file-upload-apis.md) — Transmits files to servers on different domains using CORS or iframe-based transport mechanisms. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support))
- [Cross-Origin Networking](https://awesome-repositories.com/f/networking-communication/cross-origin-networking.md) — Sends files to different domains using cross-site XMLHttpRequests or iframe redirects to bypass origin restrictions. ([source](https://github.com/blueimp/jquery-file-upload#readme))
- [File Transfer Protocols](https://awesome-repositories.com/f/networking-communication/file-transfer-protocols.md) — Divides large files into smaller segments during transfer to improve reliability and bypass server limits. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support))
- [Multipart Upload Utilities](https://awesome-repositories.com/f/networking-communication/multipart-upload-utilities.md) — Continues interrupted transfers from the last successful byte after connection failures. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Options))
- [Reliable Large File Transfer Tools](https://awesome-repositories.com/f/networking-communication/reliable-large-file-transfer-tools.md) — Provides reliable transfer of large files by splitting them into smaller segments using the Blob API.
- [Upload Progress Tracking](https://awesome-repositories.com/f/networking-communication/upload-progress-tracking.md) — Monitors and displays real-time transmission progress with the ability to cancel active uploads. ([source](https://github.com/blueimp/jquery-file-upload#readme))
- [Resumable Upload Clients](https://awesome-repositories.com/f/networking-communication/upload-progress-tracking/resumable-upload-clients.md) — Tracks the last successfully transferred byte to continue interrupted uploads without restarting the entire file.
- [Protocol-Agnostic Transport Layers](https://awesome-repositories.com/f/networking-communication/protocol-agnostic-transport-layers.md) — Switches between XHR, iframes, and postMessage to maintain compatibility across different browser and domain restrictions.
- [UI Progress Binding](https://awesome-repositories.com/f/networking-communication/upload-progress-tracking/ui-progress-binding.md) — Binds upload states to UI elements to update progress bars and status text in real time.

### Security & Cryptography

- [File Type Validators](https://awesome-repositories.com/f/security-cryptography/file-upload-security/file-type-validators.md) — Enforces restrictions on allowed file extensions and size limits before uploads are initiated. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Options))

### Web Development

- [File Uploads](https://awesome-repositories.com/f/web-development/api-management-tools/api-development-management/web-apis/file-uploads.md) — Bypasses same-origin restrictions to transmit files across domains using XHR and the postMessage API. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Cross-domain-uploads))
- [Client-Side Media Processing](https://awesome-repositories.com/f/web-development/client-side-media-processing.md) — Performs image validation and resizing directly in the browser to reduce bandwidth and server load. ([source](https://blueimp.github.io/jQuery-File-Upload/))
- [Client-Side Media Processors](https://awesome-repositories.com/f/web-development/client-side-media-processors.md) — Resizes images and generates previews in the browser to reduce bandwidth usage before transmission.
- [Cross-Domain Upload Tools](https://awesome-repositories.com/f/web-development/cross-domain-upload-tools.md) — Uses XHR, iframes, or postMessage to send files to different domains and bypass origin restrictions.
- [Cross-Domain Uploads](https://awesome-repositories.com/f/web-development/cross-domain-uploads.md) — Enables sending files to different domains using various transport mechanisms to bypass origin restrictions.

### Content Management & Publishing

- [Clipboard Integrations](https://awesome-repositories.com/f/content-management-publishing/content-management-systems/content-management-platforms/clipboard-integrations.md) — Allows users to insert and upload images by pasting them directly from the system clipboard. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support))

### Graphics & Multimedia

- [Media Header Parsing](https://awesome-repositories.com/f/graphics-multimedia/media-header-parsing.md) — Parses image headers and technical data from uploaded images to retrieve specific media details. ([source](https://github.com/blueimp/jQuery-File-Upload/wiki/Options))

### Software Engineering & Architecture

- [Lifecycle Event Hooks](https://awesome-repositories.com/f/software-engineering-architecture/lifecycle-event-hooks.md) — Provides programmable callbacks that trigger at specific stages of the file selection and transmission process.