Skip to content

umerali-chishti/quick-file-uploader

Repository files navigation

npm

Quick File Uploader

Quick file uploader for s3, html form submission

Demo

https://quick-file-uploader.netlify.app

Prerequisites

This project requires NodeJS (version 8 or later) and NPM. Node and NPM are really easy to install. To make sure you have them available on your machine, try running the following command.

$ npm -v && node -v
8.19.2
v18.10.0

Getting Started

  1. Installation
    npm install quick-file-uploader
    
  2. add upload-container id where you want to display uploader:
    <div id="upload-container"></div>
  3. Now, import upload class and initialize:
    import  Upload from 'quick-file-uploader'
    new Upload();

Custom Params

you can customise file input, preview, error and success messages base on your desire.

Name Description
container element id, by default upload-container is set for uploading
input-name name attribute, default name is name="file-input"
storage s3, local, by default local is set
mime-types for file type validation Example: "jpg|jpeg|png|pdf|svg|mp4|3gp|mov|avi|wmv"
preview callback function for file preview Received args: src, type, file number
accept attribute Example: accept="image/*,video/*,application/pdf"
size size in bytes
error callback function whenever error occur Received args: errors, file number
success callback function when file successfully upload Received args: message, file number
progress callback function for file uploading progress Received args: progress, file number
multiple boolean
path file path for s3 upload. by default tmp/ path is set
draggable boolean
onDrag callback function
onDrop callback function

Upload file on s3

  1. define s3 credentials before initialize
    window.credentials = {
       AWS_ACCESS_KEY_ID: 'xxxxxxx',
       AWS_SECRET_ACCESS_KEY:'xxxxxxx',
       AWS_DEFAULT_REGION:'xxxxxxx',
       AWS_BUCKET:'xxxxxxx',
    }
  2. Now, import upload class and initialize:
    import Upload from 'quick-file-uploader'
    new Upload({storage: 's3'});

Upload file on server through api

  1. define s3 credentials before initialize
    window.credentials = {
       UPLOAD_URL: 'xxxxxxx'
    }
  2. Now, import upload class and initialize:
    import Upload from 'quick-file-uploader'
    new Upload({storage: 'api', headers: {'Authorization': 'TOKEN'}});

License

MIT license.