This tool (File Downloader via URL) can download any file like image, video, pdf, SVG, etc. Users have to paste a valid URL of the file and click the download button to download the file. Remember, the file should be publicly accessible to download.
At first, I got the user entered file URL, and using fetch() API, I fetched the file. Once I got a response, I return the response as a blob() and in another then method, I got an object that contains details of the file.
You may like these:
- Restaurant Menu With Filter Option
- Create Todo List App
- Create a random quote generator
- Custom Select Input with search option
Then, using URL.createObjectURL() method, I created a URL of that file object. This URL is stored in the document window. At last, I created a <a> tag and stored the URL as the href value of this tag, and click it so the file download. Watch the above video for a detailed explanation of each JavaScript line.
Note: If you get a cors (cross-origin resource sharing) error in the console during file downloading, that means the browser blocked the request because the requested site doesn’t allow you to access that file.
This file downloader is made with pure JavaScript no server-side language is used to create it. If you liked it and want to create So you can check the source code or preview.
How to create a file downloader via URL using pure javascript [Source Code]
Initially, the preview will not run you'll have to click on the RUN PEN button then the program will run, and then you'll be able to check the preview.
You can make changes in this after creating this program like you can change the colors and background colors. You don't need to use only this design. You can create a better version of this by modifying it.
I hope you like it. If you want to create this. You'll have to create three files HTML, CSS with the extension for example:- For HTML - .HTML and for CSS - .css and for Javascript- .js just paste the given code in the files and don't forget to link the CSS and Javascript files to the HTML file.
Hurray! now you've created a file downloader via URL. You can download files by clicking on the download button after downloading file if you are facing any kind of problem feel free to ask me in the comment section and you can also contact me via e-mail. Thanks for giving your precious time for reading this blog. Here is the download button:-