HTML5: Display images dropped in dropzone in img tag
<p>I'm currently designing a small webpage that let's you upload png files to a ftp server using a dropzone in HTML5. When a user does drop an valid image into the dropzone, I would like to present the image within a <code>&lt;img ... /&gt;</code> tag. I got the javascript code for the dropzone, and I tried to change the src attribute by using <code>MYPICTUREID.src = file.name;</code>. This does not work since file.name brings you just the name, not the entire path. From what I read is that you can't obtain the path to the local file on the users device due to safety restrictions. What would be the best way to create a preview for a user?</p>

<p><a href="https://i.stack.imgur.com/v3wux.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/v3wux.png" alt="Picture of the planed webpage"></a></p>