CODEWITHSUNDEEP
javascripthtml
Alexander Nikolov
Alexander Nikolov

Reputation: 1979

JS - saving uploaded file do disc

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 ?

Upvotes: 4

Views: 19439

Answers (1)

Touhid Alam
Touhid Alam

Reputation: 343

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/

Upvotes: 4

Related Questions