2012-12-30 17 views
8

Diciamo che ho diverse risorse $ e qualche $ http intorno al mio applicazione angolare:AngularJS - Come sviare e codificare/decodificare su base64 tutte le richieste jsons?

myApp.factory('Note', function($resource) { 

    return $resource('http://', {id: '@id'}, 
    { 'index': { method: 'GET', isArray: true }, 
     'update': { method: 'PUT'}, 
    }); 
    }); 

con il controller

myApp.controller('NotesController',function NotesController($scope, Note, AuthenticationService) { 

$scope.notes = Note.index({}, function(data){ 
    console.log('success, got data: ', data); 
    $scope.response = "yoy!" 
    }, function(err){ 
    console.log('error, got data: ', err); 
    $scope.response = "yay!" 
    }); 
}); 

e alcune richieste sono fatte da $ http direttamente come l'autenticazione

var request = $http.post('http://', {email: email, password: password}); 

Dove e come posso dire angolare per sgonfiare e codificare/decodificare JSON su base64 prima che venga effettuata la richiesta effettiva/risposta?

Suppongo di dover eseguire il wrap delle librerie esterne per deflate e codificare/decodificare in fabbrica. E poi questa fabbrica verrà iniettata da qualche parte? Come $ httpBackend?

risposta

6

si dovrebbe avere uno sguardo ai trasformatori richiesta/risposta per il servizio $http: http://docs.angularjs.org/api/ng.$http

Richiesta/trasformatori di risposta sono semplicemente le funzioni che possono essere invocati prima di contenuto viene inviato/consegnato al chiamante. È possibile specificare le funzioni di trasformazione a livello globale (per tutte le richieste/risposte), così come ogni singola richiesta:

Per ignorare queste trasformazione a livello locale, specificare trasformare funzioni come transformRequest e/o in transformResponse della configurazione oggetto. Per sovrascrivere globalmente le trasformazioni predefinite, sovrascrivere le proprietà $ httpProvider.defaults.transformRequest e $ httpProvider.defaults.transformResponse su $ httpProvider.

Per definire trasformatori globali richiesta/risposta si potrebbe scrivere il codice del genere (è più come pseudo-codice, non funziona in tutti i browser, vedi note su Base64 sotto):

angular.module('sample', [], function($httpProvider) { 

    $httpProvider.defaults.transformRequest = function(data, headersGetter) { 
     return btoa(JSON.stringify(data)); 
    }; 

    $httpProvider.defaults.transformResponse = function(data, headersGetter) { 
     return JSON.parse(atob(data)); 
    }; 

}) 

Ovviamente il codice di trasformazione potrebbe essere più sofisticato e dipende dalle intestazioni di richiesta/risposta, ma l'idea generale è qui. Il jsFiddle con il codice (controllare la console per vedere che una richiesta si trasforma, è necessario utilizzare Mozilla o un browser WebKit): http://jsfiddle.net/Ydt5j/

Per l'effettiva conversione da/a Base64 controllare questo domanda: How can you encode a string to Base64 in JavaScript?

+0

grazie, per la risposta. Mi piacerebbe fare qualcosa come '$ httpProvider.defaults.transformRequest = function (request) {return Base64Factory.encode (request)};' my myApp.config (function() {}), ma per quanto ne so io non può iniettare fabbrica nella funzione di configurazione. Potresti essere più prolisso e aiutarmi con questo?Grazie –

+0

Ho anche provato a realizzare in myApp.run (function() {}), ma non ho ancora avuto successo? –

+0

Che errore stai ottenendo con run()? –

2
angular.module('services.base64',[]); 
angular.module('services.base64').provider('base64', function() { 

    this.encode = function(str) { 
    return base64_encode(str); 
    } 

    this.decode = function(str) { 
    return base64_decode(str); 
    } 

    this.$get = function() { 
    return {}; 
    } 

}); 

var myApp = angular.module('myApp',['services.base64']) 

myApp.config(['base64Provider', function (base64Provider) { 
    $httpProvider.defaults.transformRequest = function(request){return base64Provider.encode(request)}; 

    $httpProvider.defaults.transformResponse = function(response){return base64Provider.decode(response)}; 
}]); 
0

questo è come faccio nel filtro. item.htmlBody contiene Base64 testo codificato con tag html

// in template 
<div ng-bind-html="item.htmlBody | decodeBase64">{{item.htmlBody}}</div> 

//inside controller.js 

.filter('decodeBase64', function(){ 
    return function(text){ 
    return atob(text); 
    } 
}) 

bene, so che questo doesnt esattamente rispondere alla domanda, ma con qualche ritocco minore, è possibile ottenere ciò che si vuole (rivolte a persona futuro con lo stesso problema)