Como POSTAR arquivos binários com o AngularJS (com o upload DEMO)

incapaz de enviar arquivo com chamada de postagem angular

Eu estou tentando postar o arquivo .mp4 com alguns dados através de 1 iônico com angular 1. Ao postar através do POSTMAN é bom e funcionando. Estou obtendo Success = false no meu aplicativo.

no POSTMAN , não há headers e dados, o URL do serviço com o corpo da solicitação POST http://services.example.com/upload.php nos dados do formulário

 j_id = 4124, type = text q_id = 6, type = text u_id = 159931, type = text file = demo.mp4, type = file 

no meu aplicativo:

 $rootScope.uploadQuestion = function () { var form = new FormData(); form.append("j_id", "4124"); form.append("q_id", "6"); form.append("u_id", "159931"); form.append("file", $rootScope.videoAns.name); //this returns media object which contain all details of recorded video return $http({ method: 'POST', headers: { 'Content-Type': 'multipart/form-data' }, // also tried with application/x-www-form-urlencoded url: 'http://services.example.com/upload.php', // url: 'http://services.example.com/upload.php?j_id=4124&q_id=8&u_id=159931&file='+$rootScope.videoAns.fullPath, // data: "j_id=" + encodeURIComponent(4124) + "&q_id=" + encodeURIComponent(8) + "&u_id=" + encodeURIComponent(159931) +"&file=" + encodeURIComponent($rootScope.videoAns), data: form, cache: false, timeout: 300000 }).success(function (data, status, headers, config) { if (status == '200') { if (data.success == "true") { alert('uploading...'); } } }).error(function (data, status, headers, config) { }); } 

RECOMENDADO: arquivos binários do POST diretamente

Postar arquivos binários com dados de multi-part/form-data é ineficiente, pois a codificação base64 adiciona uma sobrecarga adicional de 33%. Se a API do servidor aceitar POSTs com dados binários, poste o arquivo diretamente:

 function upload(url, file) { if (file.constructor.name != "File") { throw new Error("Not a file"); } var config = { headers: {'Content-Type': undefined}, transformRequest: [] }; return $http.post(url, file, config) .then(function (response) { console.log("success!"); return response; }).catch(function (errorResponse) { console.error("error!"); throw errorResponse; }); } 

Normalmente, o serviço $ http codifica objects JavaScript como sequências JSON . Use transformRequest: [] para replace a transformação padrão.


DEMO do POST direto

 angular.module("app",[]) .directive("returnFiles", function() { return { require: "ngModel", link: postLink }; function postLink(scope, elem, attrs, ngModel) { elem.on("change", function(event) { ngModel.$setViewValue(elem[0].files); }); } }) .controller("ctrl", function($scope, $http) { var url = "//httpbin.org/post"; var config = { headers: { 'Content-type': undefined } }; $scope.upload = function(files) { var promise = $http.post(url,files[0],config); promise.then(function(response){ $scope.result="Success "+response.status; }).catch(function(errorResponse) { $scope.result="Error "+errorRespone.status; }); }; }) 
    
 Name={{files[0].name}} Type={{files[0].type}} RESULT={{result}} 

Intereting Posts