JS - saving uploaded file do disc

Question

I have this file input

<input type="file" class="file-input">

which I am using to upload images in my project.

How can I save the uploaded image to certain local folder with JS ?

This can't be done. But, you could use javascript to pass the file to a server side endpoint to save it. See http://stackoverflow.com/questions/461791/is-it-possible-to-write-to-a-file-on-a-disk-using-javascript — Collin, Apr 07 '15 at 16:43
@user2079802 me either, but dont being so overconfident ever ;) — Legendary, Apr 07 '15 at 16:47
Yes, can't be done with JUST JS. But if you add in a language like PHP, ASP or Node then yes, it can be done. — Raydot, Apr 07 '15 at 18:08

score 4 · Accepted Answer · answered Apr 07 '15 at 18:31

If you are willing to save the files locally, you can use the HTML5 LocalStorage feature. Its a fairly simple technology to store key/value pairs inside the browser storage. As MDN suggests, I prefer using the Web Storage API. For storing the image, a solution can be:

$('input[type="file"]').on('change', function () {
    var reader = new FileReader();
    reader.onload = function () {
        var thisImage = reader.result;
        localStorage.setItem("imgData", thisImage);
    };
    reader.readAsDataURL(this.files[0]);
});

Here's a demo storing an image from an element, storing the image inside the local storage and showing it back. http://jsfiddle.net/touhid91/nmy2b9j4/

what is localStorage..? @touhid' – Jay Momaya Jul 08 '17 at 07:34 — Jay Momaya, Jul 08 '17 at 07:34

JS - saving uploaded file do disc

1 Answers1