2012-12-30 1 views
8

내가 여러 $ 자원과가 있다고 가정하자 일부 $ HTTP 내 각 응용 프로그램 주위 : 컨트롤러AngularJS - 어떻게 deflate 및 encode/base64 모든 jsons 요청 디코딩?

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!" 
    }); 
}); 

일부 요청

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

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

직접 인증처럼 $ HTTP에 의해 만들어집니다

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

실제 요청이 이루어지기 전에 JSON을 base64로 압축 및 인코딩/디코딩하는 각도를 알 수있는 방법/응답이 수신됩니까?

필자는 외부 라이브러리를 줄이고 공장으로 인코딩/디코딩 할 것입니다. 그리고이 공장은 어디 론가 주입 될 것입니까? $ httpBackend를 좋아하십니까?

답변

6

당신은 $http 서비스에 대한 요청/응답 변압기 살펴해야한다 : http://docs.angularjs.org/api/ng.$http

요청/응답 변압기는 호출자에게 다시 넘겨 전송되는 콘텐츠하기 전에 호출 할 수있는 기능/간단하다. 당신은 (모든 요청/응답을) 세계적으로 기능을 변화뿐만 아니라 요청별로 지정할 수 있습니다

는 transformRequest 및/또는 설정 개체의 transformResponse 속성 등의 기능을 변환 지정, 로컬 이러한 변화를 무시하려면. 기본 변환을 전체적으로 재정의하려면 $ httpProvider의 $ httpProvider.defaults.transformRequest 및 $ httpProvider.defaults.transformResponse 속성을 재정의하십시오.

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)); 
    }; 

}) 
:

하나가 그 라인 (이 아래를 Base64에 대한 정보를 참조하십시오, 모든 브라우저에서 작동하지 않습니다, 많은 의사 코드와 같다)를 따라 코드를 작성하는 것이 글로벌 요청/응답 변환기를 정의하려면

물론 변형 코드는보다 정교하고 요청/응답 헤더에 따라 달라질 수 있지만 일반적인 아이디어는 여기에 있습니다. How can you encode a string to Base64 in JavaScript?

+0

답장을 보내 주셔서 감사합니다. 나는 myApp.config (function() {})에서'$ httpProvider.defaults.transformRequest = function (request) {return Base64Factory.encode (request)};}와 같은 일을하고 싶지만, 구성 기능에서 공장을 삽입 할 수 없습니다. 제발 좀 더 장황하고 좀 도와 주시겠습니까?고맙습니다. –

+0

myApp.run (function() {})에서 수행하려고했지만 여전히 성공하지 못했습니다. –

+0

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)}; 
}]); 
:이 질문을 확인 Base64로에 /에서 http://jsfiddle.net/Ydt5j/

실제 변환 : 코드를 가진 jsFiddle (요청이 전환됩니다 있는지 콘솔을 확인, 당신은 Mozilla 또는 웹킷 브라우저를 사용해야합니다)

0

이것은 필터에서하는 방법입니다. item.htmlBody이

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

//inside controller.js 

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

아니라 HTML 태그와 base64로 인코딩 된 텍스트를 포함,이 나던 정확히 질문에 대답 알고 있지만 약간의 비틀기와 함께, 당신은 당신이 (같은 문제와 미래의 사람을 표적으로) 원하는 것을 얻을 수 있습니다

관련 문제