Can I post an inline image using file field in a form

Question

I have an IMG loaded inside the HTML document, and I would like to upload it using the "file" field from a form. The form is in the same document, so I shouldn't have any security issues.

Is it possible to upload the image to a server?

I managed to upload images choosing a file from my hard drive, but I have no clue about doing it using the IMG inside the HTML document.

More information about this. The language under I want to archieve this is Javascript. I have to upload the image as multipart. — Atlantidense, Dec 14 '10 at 13:58

score 2 · Answer 1 · answered Dec 14 '10 at 13:08

2

Using javascript you can grab the 'src' attribute from the inline image (if src is a relative reference, append to the current url location) and post that as a hidden field in your form.

The serverside application would then download the image from the same source, using something like curl in PHP or urllib in python.

answered Dec 14 '10 at 13:08

Paulo Scardine

73,447
11
124
153

yep that's one way to do that if HTML5/Canvas are not an option. – Shadow The GPT Wizard Dec 14 '10 at 13:15
Perhaps a solution to this: modify jqueryform.js to upload the canvas instead a file field http://stackoverflow.com/questions/4440564/post-inline-image-using-jqueryform-plugin – Atlantidense Dec 14 '10 at 15:18
@Atlantidense: if you have full control over the client browser version (like on intranets) seems like a good solution. – Paulo Scardine Dec 14 '10 at 15:45

score 1 · Answer 2 · edited May 23 '17 at 09:58

1

I have no hands-on experience with this, but it seems to be possible using canvas.toDataURL. I don't know about IE compatibility with exCanvas.

See this SO answer for a successful solution.

edited May 23 '17 at 09:58

Community

1
1

answered Dec 14 '10 at 13:06

Pekka

442,112
142
972
1,088

score 0 · Answer 3 · edited May 23 '17 at 12:26

0

See this post Convert canvas to image and open in new window using ruby on rails and javascript

It basically POSTs the raw image data then decodes it on the server and writes it to a file. I implemented it myself, it works well.

edited May 23 '17 at 12:26

Community

1
1

answered Feb 27 '13 at 20:38

brendan

11,831
3
26
26

score 0 · Answer 4 · answered Dec 14 '10 at 13:01

0

No, that is not possible, as the HTML form will only upload files from your computer.

If you can display the image on your form page, why can't you reference its url in a hidden form field an access this field later.

So, your image would for example be <img src="URL"/>, then you could insert a field in your form that goes something like:

<input type="hidden" value="URL" name="my_image"/>

Upon submission of the form, you can access the URL of the image through the POST or GET parameters, in PHP or any language you're using. It would be best to URL-encode the URL to the image beforehand.

answered Dec 14 '10 at 13:01

slhck

36,575
28
148
201

This is actually possible using the `canvas` object – Pekka Dec 14 '10 at 13:04
I'm not sure about the details, but using `canvas` won't be a solution compatible for most browsers. – slhck Dec 14 '10 at 13:05
@slhck let the OP decide if he wants to be compatible. :) – Trufa Dec 14 '10 at 13:07
@slhck Canvas is fairly wide-spread (it is supported by every modern-day browser except IE) but if applicable in the OP's situation, your idea is very good too – Pekka Dec 14 '10 at 13:10
The browser I need to support is Safari mobile, I assume that I won't have any problems using canvas as a solution. – Atlantidense Dec 14 '10 at 13:57

Can I post an inline image using file field in a form

4 Answers4