这个问题太难了吗?
我的客户端代码包含发布数据变量,并想知道如何将文件数据添加到$http.post
。
我已经看过一些例子,他们使用的是自定义指令或手动表单提交,我都没有找到。
客户端:
<input type="file" id="photo">
//file can be accessed using
var photo = document.getElementById("photo").files[0];
$scope.data.photo = photo
OR
var formData = new FormData();
formData.append("photo", photo);
formData.append("title", $scope.data.title);
this.delegate.insert(formData);
调度服务
$http.post("/admin/speakers/?" + data, token.body) //token.body = $scope.data
.success(function(data, status, headers, config) {
})
.error(function(data, status, headers, config) {
});
期望输出服务器端(使用POSTMAN生成 - REST客户端)
console.log(request.files, request.body);
{ photo:
{ fieldname: 'photo',
originalname: '01.jpg',
name: 'fbb54fa6d588ac253ca7dab08a904356.jpg',
encoding: '7bit',
mimetype: 'image/jpeg',
path: '/var/folders/jg/hkmz0fdn64g8w1jgf60j2lcw0000gn/T/fbb54fa6d588ac253ca7dab08a904356.jpg',
extension: 'jpg',
size: 12279,
truncated: false,
buffer: null } }
{ name: 'SA',
title: 'Dev',
company: 'CA',
bio: 'some bio',
twitter: '@twitter',
sessionId: '1' }
答案 0 :(得分:0)
尝试将Content-Type header
设置为undefined
,将transformRequest
设置为angular.identity
(不要将FormData对象序列化):
$http.post("/admin/speakers/?" + data, token.body, {
transformRequest: angular.identity,
headers: {
'Content-Type': undefined
}
}).success(function(data, status, headers, config) {
}).error(function(data, status, headers, config) {
});
Angular的默认transformRequest函数将尝试序列化我们的FormData对象,因此我们使用identity函数覆盖它以保持数据不变。 Angular的POST和PUT请求的默认Content-Type标头是application / json,所以我们也希望改变它。通过设置'Content-Type':undefined,浏览器为我们设置Content-Type为multipart / form-data并填入正确的边界。手动设置'Content-Type':multipart / form-data将无法填写请求的边界参数。
(https://uncorkedstudios.com/blog/multipartformdata-file-upload-with-angularjs)