0

This may seem pointless but how would I go about coding in JavaScript... I want to upload an image from my pc to my browser and then save it back to my pc in a different location.

Josh
  • 1
  • 1
  • This won't work on a web page due to security constraints. You can approximate it in some browsers or using browser extensions but the solution will not be portable. The best you can do is allow the user to re-download it and choose where it should be saved. – Owen Aug 02 '16 at 02:31
  • You don't "upload an image from my pc to my browser". Your browser is already on your PC. Do you mean upload an image from my PC to a server via the browser? In that case, you just upload and download it again. If you mean doing something involving having your browser read and write directly to files on your PC, you can't. –  Aug 02 '16 at 03:59
  • @torazaburo Technically, it is possible at chrome, chromium using `requestFileSystem`. see http://stackoverflow.com/questions/36098129/how-to-write-in-file-user-directory-using-javascript – guest271314 Aug 02 '16 at 13:58

1 Answers1

2

You can use <input type="file"> element, change event, URL.createObjectURL(), <a> element, download attribute, .click() 

<input type="file" />
<script>
  document.querySelector("input[type=file]")
    .addEventListener("change", function(e) {
      var a = document.createElement("a");
      a.href = URL.createObjectURL(e.target.files[0]);
      a.download = e.target.files[0].name;
      document.body.appendChild(a);
      a.click();
      document.body.removeChild(a);
    })
</script>
guest271314
  • 1
  • 15
  • 104
  • 177
  • thank you! is it possible to set where the file gets saved to? – Josh Aug 02 '16 at 02:46
  • @Josh _"is it possible to set where the file gets saved to?"_ No. Not using `javascript`. User action should select location at user filesystem where file should be saved – guest271314 Aug 02 '16 at 02:48