Question

我有以下代码：

app.controller("carousels", function($http, $location, $rootScope, $state, $stateParams, $scope, PopUp, DTColumnDefBuilder, DTOptionsBuilder) {

    { ... }

    $scope.save = function() {
        $http({
            method: "POST",
            url: "./controllers/carousels/create.php",
            headers: {
                "Content-Type": "multipart/form-data"
            },
            data: $scope.carousels,
            transformRequest: function (data, headersGetter) {
                var formData = new FormData(),
                    headers = headersGetter();

                angular.forEach(data, function (value, key) {
                    formData.append(key, value);
                });

                delete headers["Content-Type"];

                return formData;
            }
        }).success(function(response) {
            console.log(response);
        });
    };
});

create.php文件完全为空，并且在表单标记上通过ng-submit调用save函数。

<form name="form" ng-submit="save()">
    <div class="box box-default">
        <div class="box-header with-border"></div>

        <div class="box-body">
            <div class="form-group" has-error>
                <label for="image">{{ "txt.pages.carousels.fields.image" | translate }}*</label>
                <div class="fileinput fileinput-new input-group" data-provides="fileinput">
                    <div style="display: table-row;">
                        <div class="form-control" data-trigger="fileinput">
                            <i class="glyphicon glyphicon-file fileinput-exists"></i>
                            <span class="fileinput-filename"></span>
                        </div>
                        <span class="btn btn-default btn-file input-group-addon">
                            <span>{{ "txt.action.file" | translate }}</span>
                            <input type="file" accept="image/*" name="image" id="image" ng-model="carousels.image" ngf-select required>
                        </span>
                    </div>

                    <div class="fileinput-preview thumbnail" data-trigger="fileinput">
                        <img ng-src="./uploads/{{ carousels.image }}">
                    </div>
                </div>
            </div>
        </div>

        <div class="box-footer">
            <button type="submit" class="btn btn-default">{{ "txt.action.save" | translate }}</button>
        </div>
    </div>
</form>

提交表单后，控制台将返回以下消息：

警告： 0
未知中的多部分/表格数据POST数据中缺少边界

此代码在我的所有项目中始终正常运行，但这次是出现此错误，我无法找到解决方案。
这个项目与其他项目的唯一区别在于，我正在使用UI-Router。我试图寻找他们之间的联系，但我一无所获。

有谁知道可能导致此错误的原因以及如何修复它？

Answer 1

经过很长一段时间，通过互联网查看各种功能，只需更改标题：

headers: {
    "Content-Type": "multipart/form-data"
},

要：

headers: {
    "Content-Type": undefined
},

代码再次正常运行。

感谢您的帮助。

Answer 2

如果你通过属性“header”解析它，为什么要删除transformRequest中的content-type？

您是否尝试不删除内容类型？

Answer 3

而不是将数据作为multipart/form-data发送：

headers: {
    'Content-Type': "multipart/form-data' 
}

您应该将其发送为application/json：

headers: {
    'Content-Type': 'application/json'
}

如果问题仍然存在，您可能还想将data更改为params。

Answer 4

我已经解决了从标头中删除Content-Type的问题，并且其工作正常

AngularJS - multipart / form-data POST中缺少边界

4 个答案: