universal-file-downloader
Table of Contents
- Description
- Installation
- Usage
3.1 Basic example
3.2 Store file in another foler
3.3 Configure fetch parameter
3.4 Using a server proxy
3.5 Download with less request
- Browser
4.1 Download File from browser
4.2 Install via cdn
4.3 Setup Proxy
- License
Description
Repository to download file from everywhere !!!
It's work in the browser / nodejs / deno
If you want to use it in node js you need to specify "type" : "module" in your package.json
Installation
You can install this package via npm:
npm install universal-file-downloader
Usage
Basic Example
Here is a basic usage example :
import ufd from 'universal-file-downloader'
await new ufd('my_file.extension_file').downloadFile('https://sample-videos.com/video321/mp4/720/big_buck_bunny_720p_1mb.mp4')
Store file in another folder
If you want to store the file in another folder
import ufd from 'universal-file-downloader'
await new ufd('my_file.extension_file').downloadFile('https://sample-videos.com/video321/mp4/720/big_buck_bunny_720p_1mb.mp4')
Configure Fetch Param
Maybe you want the file you request need to be done via POST
import ufd from 'universal-file-downloader'
await new ufd('my_file.extension_file', { method : 'POST'}).downloadFile('https://sample-videos.com/video321/mp4/720/big_buck_bunny_720p_1mb.mp4')
Using a server proxy
It's possible that you want to use a server proxy
import ufd from 'universal-file-downloader'
await new ufd('my_file.extension_file', {}, { url : 'my.server.proxy.com/', headers : {}}).downloadFile('https://sample-videos.com/video321/mp4/720/big_buck_bunny_720p_1mb.mp4')
With the given configuration the url forward will become my.server.proxy.com/https://sample-videos.com/video321/mp4/720/big_buck_bunny_720p_1mb.mp4
Be sure to configure the url as you need
Browser
Download file from browser
Downloading from the browser is more tricky : slower than in back-end (cause browser api doesn't allow stream to blob without interruption) and require a proxy (Hello CORS)
I advise you to download the video in the back-end and create a tmp link that you will return to your user then create a Blob and a download link
But If you can't / don't want to use the back-end way, use the following code who is working well
<!DOCTYPE html>
<html>
<head>
<title>Test Page</title>
</head>
<body>
<button>Download</button>
</body>
<script type="module">
import ufd from './node_modules/universal-file-downloader/dist/index.mjs';
document.querySelector('button').addEventListener('click', async () => {
const filename = "test.mp4";
const proxyOptions = {
url : 'http://localhost:8080/',
headers : {'X-Requested-With' : 'XMLHttpRequest' }
};
await new ufd('toto.mp4', {}, proxyOptions).downloadFile('https://sample-videos.com/video321/mp4/720/big_buck_bunny_720p_1mb.mp4');
});
</script>
</html>
Install via CDN
You can also use the cdn version if you don't want to use install this package
<script type="module">
import Inspector from 'https://cdn.jsdelivr.net/npm/universal-file-downloader/dist/index.mjs';
</script>
Setup proxy
If you are looking for a plugin to bypass cors i advise you tiny-cors-proxy
You can install this package via npm:
npm install tiny-cors-proxy
Then create a new file server.js and paste the following snipset :
import corsServer from 'tiny-cors-proxy';
corsServer.listen(8080);
Run the following command
node server.js
License
This project is licensed under the MIT license