broken images when uploaded to Box(Only Javascript)

Hello All,

I want to upload an images from BinaryString using Javascript(Not Node).

My code can uploaded text files(TXT, HTML etc).

Images(JPG, PNG, PDF etc) also can uploaded but they are broken.

I want to upload the image file without any problems.

How can I solve this problem?

The following is my code.

function Upload_Box(Binary){
	var token = "TOKEN";

	var blob = new Blob([Binary], {type: 'image/jpg'});
	//var file = new File([blob], 'test.jpg');
	var form = new FormData();
	form.append('Authorization', 'Bearer ' + token);
	//form.append('file', file);
	form.append('file', blob);
	form.append('attributes', '{"name":"test.jpg", "parent":{"id":"0"}}');

	$.ajax({
		url:"https://upload.box.com/api/2.0/files/content",
		type:"POST",
		contentType: false,
		processData: false,
		mimeType: "multipart/form-data",
		headers: {
			Authorization: "Bearer " + token,
		},
		data: form,
	}).done( function (data){
		console.log(data);
	});
}

Thanks,

Daeseung

mwiller

March 15, 2019 15:53

Without knowing what the error you're seeing looks like, I can't provide an exact solution, but I have a couple things you might want to check:

I noticed that you're appending the "file" form part before the "attributes" form part — this may cause issues, and I would recommend swapping the order of the parts.
If you haven't seen it already, there is a community-supported client-side JS SDK available at https://github.com/allenmichael/box-javascript-sdk that should do exactly what you're looking for. Please note that this SDK is not officially supported by Box, and if you have any issues or feature requests for it you should send those directly to the author on GitHub.

If you can provide more details about the error you're seeing, please let us know and we can see if that helps us get you closer to a solution!

Comments