Post Content-type undefined和application / json同时

Question

I am trying to upload file and post some data at the same time. The value of topicSelected is java script object array. When I check in the c# controller the value of topicSelected is null. When I check the value in my service everything is OK. I am thinking that the problem is that I am not specifying the application/json type.

setNewVideoRecord = function(file, videoName, videoVersion, topicSelected) {
    console.log(topicSelected);
    var self = this;
    var formData = new FormData();
    formData.append('file', file);
    formData.append('videoName', videoName);
    formData.append('videoVersion', videoVersion);
    formData.append('topicSelected', topicSelected);
    $http.post(self.baseUrl + "Admin/uploadVideoFile", formData, {
        withCredentials: true,
        headers: {
            'Content-Type': undefined
        },
        transformRequest: angular.identity
    }).then(function onSuccess(response) {
        self.fileNameUpload = null;
    })
}

Answer 1

You don't have an undefined content type. Telling your library that Content-Type is undefined just stops it trying to set its own default and let the underlying XMLHttpRequest object figure it out for itself. Since you are passing it a FormData object, it will examine that to identify the correct content-type (which is be multipart/mixed ).

This will encode each piece of data (including the file you are uploading) as a separate part, each of which will have its own content-type set automatically.

You can't make XHR encode the non-file data as JSON. It will use the standard multipart format with a separate part for each of the non-file inputs (and another part for the file).

You need to write the server side code to expect that format and not JSON.

Since topicSelected is a complex data structure (and not a string) you can run it through JSON.stringify() before appending it to the form data object.

Once you read the topicSelected string, you can parse it from JSON on the server.