I am trying to upload a photo (in a multipart form) from an iOS app, using AFNetworking. I am using node.js for my backend, and almost have it working. The problem is that when I am trying to save the image it is also writing the headers to the file...So all of the images I save have something like this in the beginning (when I open the image in plain text):
--Boundary+9EF923E9CAACB213
Content-Disposition: form-data; name="para"
val
--Boundary+9EF923E9CAACB213
Content-Disposition: form-data; name="afImage"; filename="afImage.jpg"
Content-Type: image/jpeg
The server code I am using is:
uploadIOS: (req, res) ->
tmpfile = variables.uploadsDir + "tempname"
ws = fs.createWriteStream(tmpfile)
req.on 'data', (data) ->
ws.write data
req.on 'end', ->
ws.end()
I can get it working using the express body parser, but would prefer to do it this way if possible. Any ideas how to strip away the headers?
You have to use a multipart-capable parser such as busboy or multiparty.
Related
I am trying to consume a REST service using TRestClient but I believe there is an issue with the boundary string for multipart content.
I am capturing the body of the request I am sending, and this is the content type header:
Content-Type: multipart/form-data; boundary=-------Embt-Boundary--07CC944C29DA577E
Then, this is the first section of the multipart form:
-----------Embt-Boundary--07CC944C29DA577E
Content-Disposition: form-data; name="file"; filename="ce.csv"
Content-Type: text/csv
And this is how it ends:
---------Embt-Boundary--07CC944C29DA577E--
I don't think this is an issue on the server, as even my proxy is not able to parse the body:
When I compare this same request vs postman, I notice that the starting and ending boundaries do not match!
Starting: -----------Embt-Boundary--07CC944C29DA577E
Ending: ---------Embt-Boundary--07CC944C29DA577E--
I found that the boundary generation is done in TMultipartFormData.GenerateBoundary() from System.Net.Mime:
When checking the starting and ending boundaries from postman, they match, so I am almost sure this is the issue. I don't think it is related to my code, but let me know if you need it.
Image Upload using el-upload component
I am getting 204 no content response from the server
el-upload(
action="https://s3-us-west-1.amazonaws.com/stage.greenausm.com",
:mulitple="false",
:data="xhrData"
:show-file-list="false", :on-success="handleAvatarSuccess",
:before-upload="beforeAvatarUpload",
)
The request to the server does not have the image data
------WebKitFormBoundaryksB7UzZHz8SWLdPk
Content-Disposition: form-data; name="file"; filename="img.jpg"
Content-Type: image/jpeg
------WebKitFormBoundaryksB7UzZHz8SWLdPk--
How can I get the component to send image data
I had a similar problem i worked around it using form data. I set the auto-upload attribute to false then passed a custom http request
<el-upload drag action="" :data="fileList" :http-request="uploadFiles" :auto-upload="false" :multiple="false" >
on the custom function to upload files I created a new formData object and handled it before uploading to the server. Here is an example
uploadFiles() {
//Create new formData object
const fd = new FormData();
//append the file you want to upload
fd.append("file", this.file.raw);
//add other data to the form data object if needed
fd.append("data", this.data);
//send call the api to upload files using axios or any other means
axios.post('http://serveUrl/upload', fd);
},
handleChange(file, fileList){
this.fileList.push(file);
},
:on-change="handleChange"
:file-list="ListFiles"
I get a request.body from web service
fp = File.open("/home/mm/mms/video_rest/video_mp.mp4", "wb")
fp.write(request.body.readline)
fp.close
but when file are create size a 0 bytes
how to view if request body are a file size or how to best way to get a video file from request body?
UPDATE
have a this params
{"video"=>#<ActionDispatch::Http::UploadedFile:0x007febdc497da0 #tempfile=#<Tempfile:/tmp/RackMultipart20151007-3197-14dis8n.mp4>, #original_filename="VID_20151006_153121393.mp4", #content_type="application/octet-stream", #headers="Content-Disposition: form-data; name=\"video_presentacion\"; filename=\"VID_20151006_153121393.mp4\"\r\nContent-Type: application/octet-stream\r\nContent-Transfer-Encoding: binary\r\n">}
how to create a file on folder and change Content-Type application/octet-stream for 'video/mp4'?
im try with:
fp = File.open("/home/mm/aa/video_rest/video_mp.mp4", "wb")
fp.write(params[:video])
fp.close
or direct for paperclipt
usuario.update_attributes!(:video => params[:video])
result => Content type invalid
Solved
on android http using a on params add a content type("video/mp4")
and work fine !
regards!
I'm trying to post a jpeg file to a locally developed web service via Fiddler. This would be simple enough, but I also need to include some data alongside the file and can’t quite nail the syntax that fiddler wants. If I click the upload file button and select a file to upload, it replaces my POST body with:
---------------------------acebdf13572468
Content-Disposition: form-data; name="fieldNameHere"; filename="PantheraLeo.jpg"
Content-Type: image/jpeg
<#INCLUDE *C:\temp\PantheraLeo.jpg*#>
---------------------------acebdf13572468—
Now I want to add some additional data:
user=1&album=2&photo=[OUTPUT FROM FILE UPLOAD]
I’ve tried putting this at the start of the body, but when my Node app receives the request, I’m getting a user parameter, an album parameter but no photo.
Any ideas on how I could format this request to get both parameters and the photo uploaded as the photo parameter?
I've also been looking to do something similar myself and stumbled on your question. I've just managed to achieve what I needed after a bit of messing about with Fiddler. Try this:
---------------------------acebdf13572468
Content-Disposition: form-data; name="model"
MyModelInfo
---------------------------acebdf13572468
Content-Disposition: form-data; model="test123"; filename="123.gif"
Content-Type: image/gif
<#INCLUDE *Z:\Downloads\123.gif*#>
---------------------------acebdf13572468--
It would seem that you link the form data being sent up in your request body to the 'acebdf13572468' boundary in the POST info. Provide the Content-Disposition with a key name (in my case 'model') and then the following line represents your actual value for this key. (In my case "MyModelInfo".
Using the above request body I was able to POST up a file as well as some accompanying POST data to my API.
The accepted answer works well. But be warned the extra line after MyModelInfo comes through into the string. Also when copying and pasting in and out of fiddler some lines were corrupted breaking the file.
Note I have named the file param "file" in the fiddler body and in the receiving API function.
This works for me:
---------------------------acebdf13572468
Content-Disposition: form-data; name="PARAM1"
Some text with a line before but not after
---------------------------acebdf13572468
Content-Disposition: form-data; name="file"; filename="filename.jpg"
Content-Type: image/jpeg
<#INCLUDE *C:\local\filename.jpg*#>
---------------------------acebdf13572468--
The data can be received in .net core 2 like this:
[HttpPost]
[Route("AddImage")]
public async System.Threading.Tasks.Task<IActionResult> AddImageAsync(IFormFile file)
{
//f is the same as file
//var f = Request.Form.Files.Count > 0 ? Request.Form.Files[0] : null;
//useful to check the keys
//var additionalProperties = Request.Form.Keys;
if (file != null)
{
try
{
if (Request.Form.TryGetValue("PARAM1", out StringValues p1))
{
var txt = p1.ToString():
Been having some difficulty with an attachment issue on my site. At the moment our iOS app is pointing at an API endpoint for attachments, and sending a request similar to this:
POST /api/v2/attachments HTTP/1.1
--Boundary+0xAbCdEfGbOuNdArY
Content-Disposition: form-data; name="attachment"; filename="attachment.jpg"
Content-Type: image/jpeg
...image data...
--Boundary+0xAbCdEfGbOuNdArY--
Now, the request succeeds and the image is in fact uploaded, but it's turning out to be an invalid image because the boundary data is written to file. It basically looks like this:
file = Tempfile.new('attachment')
attachment_data = request.body.read
attachment_data.force_encoding('UTF-8')
file << attachment_data
attachment.asset = file
attachment.save!
Obviously request.body.read is including the entire request, Boundaries and all. We do actually have a stripping method that runs through each line of the file and strips out non-image data, but that's obviously not performant at all.
In an ideal world, we would just be getting the image data itself and using that to populate the tempfile, but I'm afraid I'm completely stumped about the best way to go about that.
Thoughts welcome. Thank you!