![](/img/trans.png)
[英]Making Just One POST Request When Multiple Values Are Received in Angular App
[英]post multiple files in one request in angular cordova app
从我的应用程序联系人的后端需要在一个请求中发布所有文件,搜索解决方案的每个位置。
我目前的代码: - > -angularjs 1.5.3-
app.service('siUpload',function($q){
//...
this.upload(imageURI,url){
var deferred = $q.defer();
//.. etc.. options and other stuff
var ft = new FileTransfer();
ft.upload(imageURI, encodeURI(url),deferred.resolve,deferred.reject);
return deferred.promise
}
})
在控制器中我可以循环选择的文件并逐个上传。
angular.forEach($scope.files,function(f){
siUpload.upload(f.url,$server+'blog/'+e.grouping+'/file')
});
这很好用,但服务器需要在名称file[]
下的单个请求中发送所有文件。
在我使用angular lib ngFileUpload之前,由于输入类型=文件中的webview错误,它不再适用于android 4.4.2 :(。
所以有没有cordova-file-transfer可以在单个请求中发送多个文件? 甚至使用本机xhr在单个请求中上传多个文件?
因为我没有得到答案,并且几个赞成票,这就是我最终解决这个问题的方法。
注意我正在使用angularjs 1.x.
码:
app.service('siUpload',function(){
var formData = new FormData();
var collection = [];
var options = {
quality: 80,
destinationType: Camera.DestinationType.FILE_URL,
sourceType: Camera.PictureSourceType.CAMERA
};
this.pickFiles = function(){
var defer = $q.defer();//Create a PROMISE
//openup Camera to Capture files
navigator.camera.getPicture(
function(imageURI){
//add captured file to FormData
window.resolveLocalFileSystemURL(imageURI, function(fileEntry) {
fileEntry.file(function(file) {
var reader = new FileReader();
//add to collection for thumbnail views
collection.push(file.nativeURL);
reader.onloadend = function(fileReadResult) {
var data;
data = new Uint8Array(fileReadResult.target.result);
//add to formData for submitting
formData.append('file[]', new Blob([data], {
type: file.type
}), file.name);
//return [0]=>collection of thumbnails [1]=>formData to be posted
defer.resolve([collection,formData]);
};
defer.notify('got image, appending it to formData');
reader.readAsArrayBuffer(file);
});
});
},
function(message){
defer.reject('Camera rejected'+message);
},options);
return defer.promise;
}
使用此功能我可以在我的控制器中触发
$scope.capture = function(){
siUpload.pickFile().then(
function(r){
//r contain thumbnails and form data
$scope.thumbnails = r[0];
var fd = r[1];
angular.forEach($scope.post,function(val,key){
fd.append(key,val); //adding extra paramters to the post request
});
//POSTING All FILES and data in one request :)
$http.post('API://blog', fd, {
headers: {'Content-Type': undefined },
transformRequest: angular.identity
});
});
}
希望这有助于未来的googlers :-)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.