@hypermedialabs/uploader NPM

What is Client Uploader?

Client Uploader is a library for handling media file uploads in web applications. Integrating Uppy and tus-js-client, this library simplifies the process of uploading files to your server and provides extensive customization and callback options.

Features

Easy Integration: Seamlessly adds media file uploading to your projects.
Customizable: Offers various options to control file types, sizes, and the number of files.
Progress Tracking: In-built callback functions to track upload progress.
Error Handling: Robust mechanisms to handle and report errors during uploads.

Installation

Install Client Uploader via npm:

npm install @hypermedialabs/uploader

yarn add @hypermedialabs/uploader

Usage

First, import the HypermediaUploader function:

import HypermediaUploader from '@hypermedialabs/uploader';

Then, implement the uploader in your application:

const { uploader } = new HypermediaUploader(endpoint, options);

function handleChange(event) {
  // Get the file from the event
  const files = event.target.files[0];

  // Add the file to the uploader
  // `addFiles` is a method from Uppy
  uploader.addFiles(files);
}

API Reference

HypermediaUploader(endpoint, options)

endpoint: string - The server endpoint to get upload information. This upload information is REQUIRED to upload your video into our servers. We recommend strongly use the Hypermedia Gateway to make sure your information is secure from CSRF attacks but you can use any server you want to make the request to our API and get the upload information anyway.
options: Object - Configuration options for the uploader.
- onError: function - Callback for upload errors.
- onProgress: function - Callback for tracking upload progress.
- onSuccess: function - Callback for successful uploads.
- autoProceed: boolean - Whether to start uploading automatically after adding files.
- debug: boolean - Whether to enable debug mode.
- restrictions: Object - Restriction options for the uploader.
  - minFileSize: number - Minimum file size for upload.
  - maxFileSize: number - Maximum file size for upload.