JavaScript File Downloader With Promise Support

Category: Javascript | May 25, 2020
Author: AleeeKoi
Views Total: 106
Official Page: Go to website
Last Update: May 25, 2020
License: MIT

Preview:

JavaScript File Downloader With Promise Support

Description:

A JavaScript file downloader library that provides a user-friendly file download experience on the web.

The downloader returns a promise indicating whether a download is ended that then can be used for further processing.

How to use it:

1. Install & download the package.

# NPM
$ npm install js-file-downloader --save

2. Import the file downloader as a module.

import Downloader from 'js-file-downloader';

3. Or load the js-file-downloader.min.js from the dist folder.

<script src="./dist/js-file-downloader.min.js"></script>

4. Create a new downloader instance the specify the path to the file to be downloaded.

new jsFileDownloader({ 
    url: '1.jpg' 
})

5. Do something when the download is ended.

new jsFileDownloader({ 
    url: '1.jpg' 
})
.then(function () {
  alert('File downloaded');
});

6. Do something when an error occurred.

new jsFileDownloader({ 
    url: '1.jpg' 
})
.catch(function (error) {
  // do something
});

7. Determine the maximum time to wait before stopping downloading. Default: ‘40000’.

new jsFileDownloader({ 
    url: '1.jpg',
    timeout: 50000
});

8. Determine whether to disable download on mobile devices. Default: true.

new jsFileDownloader({ 
    url: '1.jpg',
    mobileDisabled: false
})

9. Determine whether to auto start downloading on page load. Default: true.

new jsFileDownloader({ 
    url: '1.jpg',
    autoStart: false
});

10. Determine whether to force desktop mode even on mobile devices for downloading files. Default: false.

new jsFileDownloader({ 
    url: '1.jpg',
    forceDesktopMode: true
});

11. Customize the request header data.

new jsFileDownloader({ 
    url: '1.jpg',
    headers: [
      { name: 'Authorization', value: 'Value...' }
    ]
});

12. Customize the file name.

new jsFileDownloader({ 
    url: '1.jpg',
    filename: 'cssscript.jpg'
});

13. Check download status using the process function.

new jsFileDownloader({ 
    url: '1.jpg',
    process: process
});

function process (event) {
  if (!event.lengthComputable) return;
  var downloadingPercentage = Math.floor(event.loaded / event.total * 100);
  // what to do ...
};

14. Determine the method for the HTTP request.

new Downloader({ 
    url: '...',
    method: 'POST' // "GET", "POST", "PUT
})

Changelog:

v1.1.8 (05/25/2020)

  • Added new “method” option to customize HTTP request method

v1.1.7 (04/24/2020)

  • Added support for XMLHttpRequest.withCredentials

You Might Be Interested In:


Leave a Reply