将Content-Type header设置为multipart

Set Content-Type header to multipart?

本文关键字:multipart 设置 header Content-Type      更新时间:2023-09-26

Angular建议将'Content-Type' header设置为undefined (https://docs.angularjs.org/api/ng/service/$http),这样浏览器就可以获取文件数据并提供正确的Content-Type header。

但是当我上传PDF时,内容类型被设置为'text/plain;charset=UTF-8'。我希望将内容类型设置为multipart,因为这是后端所期望的,但是如果浏览器负责设置内容类型,我如何实现这一点呢?

我也试过这篇文章的策略,但无济于事。我也尝试使用Dropzone.js与相同的结果。

下面是请求本身的代码:
uploadFile: function(token, baseurl, projectname, filename, file) { 
        var dataUpload= {
          method: 'PUT',
          url: baseurl + '/projects/' + projectname + '/files/' + filename,
          transformRequest: angular.identity,
          headers: {
                  'Authorization': 'bearer ' + token,
                  'Accept': "application/json",
                  'Content-Type': undefined
                },
          data: {
            'files': file
          }
      };
      return dataUpload;
    }

下面我包括以前链接的帖子的代码应该工作,但当我使用它与我自己的url发生同样的事情:浏览器设置内容类型为'text/plain;charset=UTF-8',我从后端得到一个415错误。如何?为什么?任何帮助(包括后端解决方案)将非常感激。这件事我已经做了好几天了。

JavaScript:

var myApp = angular.module('myApp', []);
myApp.directive('fileModel', ['$parse', function ($parse) {
 return {
    restrict: 'A',
    link: function(scope, element, attrs) {
        var model = $parse(attrs.fileModel);
        var modelSetter = model.assign;
        element.bind('change', function(){
            scope.$apply(function(){
                modelSetter(scope, element[0].files[0]);
            });
        });
    }
 };
}]);
myApp.service('fileUpload', ['$http', function ($http) {
 this.uploadFileToUrl = function(file, uploadUrl){
    var fd = new FormData();
    fd.append('file', file);
    $http.post(uploadUrl, fd, {
        transformRequest: angular.identity,
        headers: {'Content-Type': undefined}
    })
    .success(function(){
    })
    .error(function(){
    });
 }
}]);
myApp.controller('myCtrl', ['$scope', 'fileUpload', function($scope, fileUpload){
$scope.uploadFile = function(){
    var file = $scope.myFile;
    console.log('file is ' );
    console.dir(file);
    var uploadUrl = "/fileUpload";
    fileUpload.uploadFileToUrl(file, uploadUrl);
};
}]);
HTML:

<div ng-controller = "myCtrl">
    <input type="file" file-model="myFile"/>
    <button ng-click="uploadFile()">upload me</button>
</div>

我想现在回答这个问题已经太晚了,但是如果有人遇到同样的问题。

代码中的错误在这里:

data: {
    'files': file
}

你的表单数据对象已经有你的后端所期望的字段的信息,所以,你需要改变这一行:

data: file

如果你已经手动创建了FormData对象,你可能会有这样的东西:

var fd = new FormData();
fd.append("files", $scope.file);