Input field not returning the expected value

Question

I am trying to return the file path of an image via an input field with type file, where the user selects the image from the window that appears when the user clicks the browse button. I need to use this path so that after the user selects an image it is placed in the webpage. The file structure is shown below:

-Local Disk (C)
  -Users
    -f
      -Desktop
        -001.jpg <-- the image
        -index.html <-- the webpage

I am expecting the input field to return the absolute path of the image, that is C:/Users/f/Desktop/001.jpg, while it is just returning C:\fakepath\001.jpg. Here is the code:

function myFunction() {
  var image = document.createElement('img');
  image.src = document.getElementById('image').value;
  console.log(document.getElementById('image').value);
}

<input id="image" type="file" onchange="myFunction()">

score 1 · Accepted Answer · answered Apr 02 '17 at 12:59

1

That's not possible. It is a browser limitation.

Browsers hide the real path when uploading files to ensure security.

answered Apr 02 '17 at 12:59

Anonymous

4,692
8
61
91

Input field not returning the expected value

1 Answers1