Why am I missing "filename" and "Content-Type" when uploading an image using form data?
I am trying to upload an image from my AngularJs client to the Django REST API.
My title is fine. Has the correct content type
Content-Type: multipart / form-data; border = --- WebKitFormBoundaryYtkiHFTO9IU6LLxB
but my request payload looks like
------ WebKitFormBoundaryYtkiHFTO9IU6LLxB
Content-Disposition: form-data; name = "photo"
------ WebKitFormBoundaryYtkiHFTO9IU6LLxB -
instead of (as seen with Chrome Advanced Extension REST Client)
------ WebKitFormBoundaryrezxw2nm5Ty5NVg7
Content-Disposition: form-data; name = "photo"; filename = "image.png"
Content-Type: image / png
------ WebKitFormBoundaryrezxw2nm5Ty5NVg7 -
As you can see, I'm missing the "filename" and "Content-Type" variables, and I'm guessing it has something to do with why my image is not being accepted by the Django REST Api.
My code is shown below. I used to shoot an image using the cordova camera plugin and I have a url file. I am using this to get the fileEntry object and File object from this. Hope the File object is the correct one that I am using. Please suggest where I am going wrong.
fileStorageService.resolveUrl($scope.userProfile.user.photo).then(function(fileEntry){
var fd = new FormData();
fileEntry.file(function(file){
//var blob = new Blob(file.getAsBinary(), { type: "image/jpg"});
//var blob = file.slice(file.start,file.end,file.type);
fd.append('photo',file,file.name);
userService.updateUser(baselink,id,fd).then(function(response){
ngNotify.set("Updated your profile photo",{
type: 'info',
position: 'bottom',
sticky: false,
duration: 2000
});
$scope.editable = false;
},function(error){
console.log(error);
ngNotify.set("Unable to send your profile photo. Please try again later",{
type: 'warn',
position: 'bottom',
sticky: false,
duration: 2000
});
});
},function(error){
console.log(error);
});
});
source to share
No one has answered this question yet
Check out similar questions: