I am sending a post request to the backend through axios to fetch a Multipart/form-data type response where I receive 1. An Application/json type data and 2. An Application/octet-stream type data which basically is a pdf. Following is the response type passed to the axios post request
responseType: "multipart/form-data",
The response is in the form of string as follows:
--8VsLrsii3Po8wSx8HnipQLwYFlOFDP_FJ-xrfQUv
Content-Disposition: form-data; name="dati"
Content-Type: application/json
[{}]
--8VsLrsii3Po8wSx8HnipQLwYFlOFDP_FJ-xrfQUv
Content-Disposition: form-data; name="pdf"
Content-Type: application/octet-stream
Content-Length: 8481
%PDF-1.5
%����
4 0 obj
<</Filter/FlateDecode/Length 3834>>stream
x���Mo�����wS Xz��\�m8#�V�)�l5PK��h~}I��Α��5��&lү�gμ���4{����K������7�����O���퇛�no~�q�o�?]�3���ۏ7���k.��������\�m�l���M�8͗��q��z��N�����n��}����������w�����7_��|�����}�J���/��������&���h&L��Wּrƹ�JɎ�^��G.................................
%%EOF
--8VsLrsii3Po8wSx8HnipQLwYFlOFDP_FJ-xrfQUv--
I am able to seperate the json part and the pdf part and i am able to get the name, content-type and the actual json data as well as the pdf part. I am using the following code to access the pdf
var data = response // response is the data from the endpoint
var binaryLen = data.length;
var bytes = new Uint8Array(binaryLen);
for (var i = 0; i < binaryLen; i++) {
var ascii = data.charCodeAt(i);
bytes[i] = ascii;
}
var pdfDownload = new Blob([bytes], { type: "application/pdf" });
var url = window.URL || window.webkitURL;
var link = url.createObjectURL(pdfDownload);
var a = document.createElement("a");
a.setAttribute("href", link);
a.setAttribute("target", "_blank");
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
And I am getting an empty pdf
Does anyone know a way for me to be able to get correct pdf?
Related
I'm relatively new to rust and using reqwest to fetch a PDF document from a REST API endpoint. The content-type of the response is multipart/form-data; boundary=bc1f6465-6738-4b46-9d9d-b9ae36afa8cb with two parts:
--bc1f6465-6738-4b46-9d9d-b9ae36afa8cb
Content-Disposition: form-data; name="metadata"
Content-Type: application/json
{"documentId":"QkNfRENfSUwwMDEsRTA1OEU3ODQtMDAwMC1DNzY5LTg1MjktMTRFRkI5RTBFNjRF"}
--bc1f6465-6738-4b46-9d9d-b9ae36afa8cb
Content-Disposition: form-data; name="document"; filename=document.pdf
Content-Type: application/pdf
%PDF-1.4
<binary content>
%%EOF
--bc1f6465-6738-4b46-9d9d-b9ae36afa8cb--
I want now to save the PDF document in the 2nd part as a valid PDF file on disk. But the multipart functionality within reqwest seems to create new multipart requests whereas I need to parse a multipart response.
My code to download the file:
use reqwest::{self, header::AUTHORIZATION};
fn main() {
let url = "https://example.com/rest/document/123";
let authorization_header = String::from("Bearer ") + access_token.as_str();
let res = client.get(url)
.header(AUTHORIZATION, &authorization_header)
.send()
.expect("Error calling API");
}
Any hint on how to process the multipart/form-data response is appreciated!
I'm using NAVER API to detect faces, so I have to send POST message to API server. The format of message is like below.
[HTTP Request Header]
POST /v1/vision/face HTTP/1.1
Host: openapi.naver.com
Content-Type: multipart/form-data; boundary={boundary-text}
X-Naver-Client-Id: {Client ID}
X-Naver-Client-Secret: {Client Secret}
Content-Length: 96703
--{boundary-text}
Content-Disposition: form-data; name="image"; filename="test.jpg"
Content-Type: image/jpeg
{image binary data}
--{boundary-text}--
After I checked format, I wrote using MultipartRequest and MultipartFile.
Future<void> getFaceData() async {
final Uri url = Uri.parse('https://openapi.naver.com/v1/vision/face');
final request = http.MultipartRequest('POST',url);
request.fields['X-Naver-Client-Id'] = 'client key(I added real value)';
request.fields['X-Naver-Client-Secret'] = 'client secret(I added real value)';
request.files.add(await http.MultipartFile.fromPath(
'image',
_image.path,
contentType: MediaType('multipart','form-data')
));
http.StreamedResponse response = await request.send();
print(response.statusCode);
}
But this code gets 401 error which is UNAUTHORIZED. What is the problem? How can I fix it?
The X-Naver... values are HTTP headers, rather than form fields. Add them like this instead:
request.headers['X-Naver-Client-Id'] = 'client key(I added real value)';
request.headers['X-Naver-Client-Secret'] = 'client secret(I added real value)';
I am trying to do a multi-part upload from my javascript application and it works fine in the chrome browser but fails without error when run in electron.
I can't find information, why it fails in electron, but maybe some of you have an idea? :)
var fileContent = new Uint8Array([64,65,66,67]);
var fileBlob = new Blob([fileContent], {type: 'application/octet-stream'});
var data = new FormData();
data.set('file', fileBlob, 'blob.bin');
fetch('http://my.end.point', {
method: 'POST',
body: data
});
When I run that code in Chrome, I can see the 4 bytes payload in the network tab and my end point receives the 4 bytes. If I do the same in electron, the payload in the network tab is empty and the end point receives the multi-part request with the payload missing. I also tried using XMLHttpRequest instead of fetch but that shows exactly the same behavior.
Request Payload from within electron:
------WebKitFormBoundaryNXzPiiAvBttdDATr
Content-Disposition: form-data; name="file"; filename="blob.bin"
Content-Type: application/octet-stream
------WebKitFormBoundaryNXzPiiAvBttdDATr--
Request payload from withon chrome browser:
------WebKitFormBoundarywTEtXn4z3NFt3sAb
Content-Disposition: form-data; name="file"; filename="blob.bin"
Content-Type: application/octet-stream
#ABC
------WebKitFormBoundarywTEtXn4z3NFt3sAb--
Does someone know, why it doesn't work from within electron?
Using the basic fine-uploader and addFile to insert a blob based entry.Everything goes ok until the server reject the request due to "security issues".
If I convert the blob to a file and send it to the fine-uploader the server is quite happy. The only difference between the two requests is the filename in the request header.
The file-uploader setName() doesn't appear to change to "blob" name.
fails:
Content-Disposition: form-data; name="qqfile"; filename="blob"
Content-Type: image/jpeg
Any way to replace the 'filename="blob"' with a name that contains the correct extension - blob.jpg, blob.gif,etc?
var myblob = new Blob([outputBuffer], {type: "image/jpeg"});
myblob.name = ofile;
var myfile = new File([myblob], 'ImageTest.jpg', {
lastModified: new Date(0), // optional - default = now
type: "image/jpeg" // optional - default = ''
});
fineUploader.addFiles({blob:myblob, name:ofile});
console.log(fineUploader.getName(0));
fineUploader.setName(0,ofile);
console.log(fineUploader.getName(0));
fineUploader.addFiles(myfile);
If I have a file on s3 how can I change metadata of that file?
It looks like I can "copy" it to the same location with new headers which would effectively be the same thing.
I'm using knox as the node client to do this. The file in question already has the Content-Type header set to video/mp4 but I want to change it to application/octet-stream. The reason for this is so that this link will trigger the browser to download the resource instead of displaying it in the browser window.
Link to knox source for this function
var filename = "/example/file.mp4",
headers = {'Content-Type': "application/octet-stream"};
client.copyFile(filename, filename, headers, function(error, resp) {
//response is successful
});
The response is successful, but when I reload the resource in s3 I don't see that headers have changed.
I can see that the underlying API call is this:
'PUT /example/file.mp4 HTTP/1.1\r\nContent-Type: application/octet-stream
x-amz-copy-source: /bucket/example/file.mp4
Content-Length: 0\r\nDate: Thu, 28 Jan 2016 21:13:12 GMT
Host: cc-video-archives-dev.s3.amazonaws.com
Authorization: <redacted>=\r\nConnection: close\r\n\r\n',
I was missing this header:
"x-amz-metadata-directive": "REPLACE"
var filename = "/example/file.mp4",
headers = {
"x-amz-metadata-directive": "REPLACE",
'Content-Type': "application/octet-stream"
};
client.copyFile(filename, filename, headers, function(error, resp) {
//response is successful
});