Using file:// for an image

[Phat G5 (G3)]

I am trying to do something seemingly difficult. I am trying to take the
value from a file input and set the source of an image to the value of the
file input. It seems to only work on Safari. In FF I can do it and then when
viewing the rendered chart I see the image is there with the correct path
and all. For example file:///Users/me/desktop/1234.jpg Is this a security
thing? I can have multiple images from multiple domains on a page but not
one from the users hd. Confusing? Here is a sample of the code:

<img src="" id="preview">

<input type="file" name="test"
onchange="document.getElementById('preview').src = ('file://'+this.value);">


Again, this works in Safari perfectly. In FF I can view the source chart and
it has the correct path. Just not displaying. I even tried using the DOM to
create a new image and plant it on the page. The image is there but not
displayed. Is there a work around for this?

-S

 

[Joshie Surber]

I am trying to do something seemingly difficult. I am trying to take the
value from a file input and set the source of an image to the value of the
file input. It seems to only work on Safari. In FF I can do it and then when
viewing the rendered chart I see the image is there with the correct path
and all. For example file:///Users/me/desktop/1234.jpg Is this a security
thing? I can have multiple images from multiple domains on a page but not
one from the users hd. Confusing? Here is a sample of the code:
...

Yes, this is a security thingie. JavaScript is kept away from file
uploads to keep someone from emailing themself /etc/passwd or whatever,
and most vendors extended that to include all file uploads. How reading
an uploaded file is unsafe I don't know or understand, though. A simple
alternative would be to have your file upload form in an iframe, and
have the PHP return a simple page that does nothing but run some JS to
set your <img>'s src attribute.

Simple.

 

[Csaba Gabor]

I am trying to do something seemingly difficult. I am trying to take the
value from a file input and set the source of an image to the value of the
file input. It seems to only work on Safari. In FF I can do it and then when
viewing the rendered chart I see the image is there with the correct path
and all. For example file:///Users/me/desktop/1234.jpg Is this a security
thing? I can have multiple images from multiple domains on a page but not
one from the users hd. Confusing? Here is a sample of the code:

<img src="" id="preview">

<input type="file" name="test"
onchange="document.getElementById('preview').src = ('file://'+this.value);">


Again, this works in Safari perfectly. In FF I can view the source chart and
it has the correct path. Just not displaying. I even tried using the DOM to
create a new image and plant it on the page. The image is there but not
displayed. Is there a work around for this?

A security thing. See
http://www.mozilla.org/projects/security/known-vulnerabilities.html#firefox1.5.0.4
and then the link for MFSA 2006-39 for some partial info on it.

I'm guessing that the reasons for not allowing this are that the files
could have malicious code embedded (but I'd think that would be the
responsibility of the individual components to deal with) and more
importantly, that you could possibly guess at the files/directory
structure on the user's machine.

Csaba Gabor from Vienna