Upload de imagem via post JSON

[Helio13]

Boas!

Estou a fazer uma aplicação em angularjs que comunica com uma api rest json.

E queria implementar agora um upload de fotos...mas não sei muito bem como enviar a imagem por json, sei que posso utilizar o Base64 ou o multipart/form-data

Estou a tentar este código, mas ele não me envia nada, alguém me pode ajudar?

var myApp = angular.module('myApp',['ngResource']);
function MyCtrl($scope, $resource) {
$scope.movies = $resource('/test/api/v1/Movie/:id/',
 {},
 { 'get': {method:'GET', params: {id: '@id'} },
'update': {method:'PUT', params:{id: '@id'}},
'save': {method:'POST', params: {},
'query':  {method:'GET', }},
'remove': {method:'DELETE', params:{id: '@id'}},
'delete': {method:'DELETE'} });

$scope.saveUpload = function(modelInstance) {
 var files = document.getElementById('img').files[0];
	 console.log(files);
	 $scope.movies.save({MovieCover: files,
	   params:modelInstance,
		headers: {'Content-Type': 'multipart/form-data'}
		 })
 }		  
}

[malleus]

Não se pode enviar uma imagem por JSON. Se te limitares a browsers com suporte HTML5 podes usar o método toDataUrl de um objecto canvas e a API FileReader: http://stackoverflow.com/questions/13938686/can-i-load-a-local-file-into-an-html-canvas-element

Isto nada em prejuízo de imensas soluções que já existem por aí (uploadify, etc).

[HappyHippyHippo]

Não se pode enviar uma imagem por JSON. Se te limitares a browsers com suporte HTML5 podes usar o método toDataUrl de um objecto canvas e a API FileReader: http://stackoverflow.com/questions/13938686/can-i-load-a-local-file-into-an-html-canvas-element

Isto nada em prejuízo de imensas soluções que já existem por aí (uploadify, etc).

vou ignorar este post ...

podes muito bem fazer o enconding do ficheiro para base64 (exemplo : http://stackoverflow.com/questions/246801/how-can-you-encode-to-base64-using-javascript) e enviar no JSON

o PHP terá depois de fazer o decode e gravar num ficheiro

[malleus]

Uh...como é que fazes o encode de algo a que ainda não tens acesso? Essa abordagem apenas funciona se já tiveres a imagem no servidor e neste caso estamos a falar de upload de ficheiros para o servidor (note-se o acesso à propriedade FILES de um INPUT do tipo FILE).

[HappyHippyHippo]

Uh...como é que fazes o encode de algo a que ainda não tens acesso? Essa abordagem apenas funciona se já tiveres a imagem no servidor e neste caso estamos a falar de upload de ficheiros para o servidor (note-se o acesso à propriedade FILES de um INPUT do tipo FILE).

e quem te disse que não tenho acesso ?

http://www.w3.org/TR/FileAPI/

Edited May 9, 2013 at 10:25 PM by HappyHippyHippo

[malleus]

Boa, a FileApi...que contém o FileReader. :\