@uppy/core

What is @uppy/core?

@uppy/core is a modular JavaScript file uploader that integrates with various file sources and provides a highly customizable and extensible API for handling file uploads.

What are @uppy/core's main functionalities?

File Selection

This feature allows users to select files from their local system using a customizable dashboard interface.

const Uppy = require('@uppy/core');
const Dashboard = require('@uppy/dashboard');

const uppy = Uppy();
uppy.use(Dashboard, {
  inline: true,
  target: 'body'
});

File Upload

This feature enables the uploading of selected files to a specified endpoint using XHR (XMLHttpRequest).

const Uppy = require('@uppy/core');
const XHRUpload = require('@uppy/xhr-upload');

const uppy = Uppy();
uppy.use(XHRUpload, {
  endpoint: 'https://my-upload-endpoint.com/upload'
});

uppy.upload().then((result) => {
  console.log('Upload complete:', result);
});

Progress Tracking

This feature provides a progress bar to track the upload progress of files.

const Uppy = require('@uppy/core');
const ProgressBar = require('@uppy/progress-bar');

const uppy = Uppy();
uppy.use(ProgressBar, {
  target: 'body',
  hideAfterFinish: false
});

File Validation

This feature allows for custom validation of files before they are uploaded, such as checking file size or type.

const Uppy = require('@uppy/core');

const uppy = Uppy();
uppy.on('file-added', (file) => {
  if (file.size > 1000000) { // 1MB
    uppy.removeFile(file.id);
    alert('File is too large!');
  }
});

Other packages similar to @uppy/core

dropzone

Dropzone is a popular JavaScript library that provides drag-and-drop file uploads with image previews. It is less modular than @uppy/core but offers a simpler setup for basic use cases.

fine-uploader

Fine Uploader is a comprehensive JavaScript library for file uploads that supports various features like chunking, retry, and concurrent uploads. It is more feature-rich but also more complex compared to @uppy/core.

plupload

Plupload is a JavaScript library that handles file uploads with support for multiple runtimes (HTML5, Flash, Silverlight, etc.). It is similar in functionality to @uppy/core but may require more configuration for advanced use cases.

README

@uppy/core

Uppy is a sleek, modular JavaScript file uploader that integrates seamlessly with any application. It’s fast, provides a comprehensible API and lets you worry about more important problems than building a file uploader.

• Fetch files from local disk, remote urls, Google Drive, Dropbox, Instagram, or snap and record selfies with a camera;
• Preview and edit metadata with a nice interface;
• Upload to the final destination, optionally process/encode

Read the docs | Try Uppy

Uppy is being developed by the folks at Transloadit, a versatile file encoding service.

Example

import Uppy from '@uppy/core'

const uppy = new Uppy()
uppy.use(SomePlugin)

Installation

$ npm install @uppy/core

Alternatively, you can also use this plugin in a pre-built bundle from Transloadit’s CDN: Edgly. In that case Uppy will attach itself to the global window.Uppy object. See the main Uppy documentation for instructions.

Documentation

Documentation for this plugin can be found on the Uppy website.

License

The MIT License.

Changelog

3.3.0

Released: 2022-11-10

| Package | Version | Package | Version | | ---------------------- | ------- | ---------------------- | ------- | | @uppy/angular | 0.5.0 | @uppy/image-editor | 2.1.0 | | @uppy/aws-s3-multipart | 3.1.0 | @uppy/locales | 3.0.4 | | @uppy/companion | 4.1.0 | @uppy/tus | 3.0.5 | | @uppy/companion-client | 3.1.0 | @uppy/utils | 5.1.0 | | @uppy/dashboard | 3.2.0 | uppy | 3.3.0 |

• @uppy/companion: change default S3 expiry from 300 to 800 seconds (Merlijn Vos / #4206)
• @uppy/dashboard: Single file mode (Artur Paikin / #4188)
• @uppy/locales: Fix UZ locale (Merlijn Vos / #4178)
• @uppy/utils: update typings for RateLimitedQueue (Antoine du Hamel / #4204)
• @uppy/aws-s3-multipart: empty the queue when pausing (Antoine du Hamel / #4203)
• @uppy/image-editor: add checkered background (Livia Medeiros / #4194)
• @uppy/aws-s3-multipart: refactor rate limiting approach (Antoine du Hamel / #4187)
• @uppy/companion: send expiry time along side S3 signed requests (Antoine du Hamel / #4202)
• @uppy/companion-client: add support for AbortSignal (Antoine du Hamel / #4201)
• @uppy/companion-client: prevent preflight race condition (Mikael Finstad / #4182)
• @uppy/aws-s3-multipart: change limit to 6 (Antoine du Hamel / #4199)
• @uppy/utils: add cause support for AbortErrors (Antoine du Hamel / #4198)
• meta: Fix bad example for setFileState (Tim Whitney / #4191)
• meta: Update code example for getFiles (Tim Whitney / #4189)
• meta: Fix issue with outdated comment. (Tim Whitney / #4192)
• @uppy/aws-s3-multipart: remove unused timeout option (Antoine du Hamel / #4186)
• meta: Remove dollar sign from command for easier copy/pasting (Youssef Victor / #4180)
• @uppy/aws-s3-multipart,@uppy/tus: fix Timed out waiting for socket (Antoine du Hamel / #4177)
• meta: Add note about facebook approval (Mikael Finstad / #4172)
• meta: add a manual deploy for website (Antoine du Hamel / #4171)