핸들 리디렉션(angularjs $http)

핸들 리디렉션(angularjs $http)

앱에서 angularjs http 서비스를 사용하고 있는데 웹사이트에서 이를 발견했습니다.

AJAX 호출이 성공하면(서버에서 200에서 209 사이의 HTTP 코드를 다시 전송함) success() 함수에 전달된 함수가 실행됩니다.AJAX 호출이 실패하면(방향 전환을 제외한 다른 모든 코드) error() 메서드로 전달된 함수가 실행됩니다.

분명 리다이렉트 상태 코드는 성공의 일부가 아니며 에러 콜백도 아닙니다.그럼 리디렉션을 어떻게 처리해야 합니까?

http get을 사용하여 서버에서 데이터를 가져오는 스크립트입니다.세션이 만료되면 서버는 302 상태 코드를 반환합니다.나는 그 상태 코드를 잡고 로그인으로 페이지를 리디렉션해야 합니다.

app.controller('GraphController', function($scope, $http, localStorageService, $interval) {
        $scope.GraphData = [{"key":"in","values":[]},{"key":"out","values":[]}]; 

        $scope.pollStats = function() {
            $http.get('/statistics/getStat').success(function(lastData, status, headers) {              
                if (status==302) {
                    //this doesn't work
                    //window.location=headers('Location');
                    //this doesn't work either
                    window.location.replace(headers('Location'));
                }else if (status==200) {
                    ...processData
                }
            });
        };
});

성공적인 콜백이 리디렉션을 처리할 수 없기 때문에 스크립트가 작동하지 않는 것은 분명합니다.그럼 어떻게 대처해야 하죠?

이것은 저의 프로젝트와 관련된 것이니 참고하시기 바랍니다.

목표: 302 상태 코드를 잡고 페이지를 리디렉션(내 경우 로그인)

결과: firebug에서는 응답 코드가 302인 것을 알 수 있었지만, angularjs는 상태 값(response.status)만 출력하면 200이 반환됨을 알 수 있었습니다.그래서 처음에 당신은 당신이 희망이 없다고 생각했을 겁니다.하지만 제 경우에는 데이터(response.data)를 가져오는 일을 했습니다. 로그인 페이지에서만 찾을 수 있는 문자열을 찾아보세요.그럼 됐어요. 문제 해결 :D

여기서 아이디어를 얻었습니다.

코드는 이렇습니다.

app.factory('redirectInterceptor', function($q,$location,$window){
    return  {
        'response':function(response){
        if (typeof response.data === 'string' && response.data.indexOf("My Login Page")>-1) {
            console.log("LOGIN!!");
            console.log(response.data);
            $window.location.href = "/login.html";
            return $q.reject(response);
        }else{
            return response;
        }
        }
    }

    });

    app.config(['$httpProvider',function($httpProvider) {
        $httpProvider.interceptors.push('redirectInterceptor');
    }]); 

처음 로그인할 때 사용자에게 비밀번호를 변경하라는 메시지가 표시되는 구현 방법을 찾으려다 이 문제도 마찬가지입니다.

이 문제를 해결하는 방법은 서버가 UI-Router의 상태 제공자에게 필요한 정보를 포함하는 위치 헤더가 있는 (비공식) 210 상태 코드를 반환하게 하는 것입니다.맨 앞에 있는 컨트롤러에 다음과 같이 추가했습니다.

if (data.status == 210) {
  var location = data.headers().location;
  $state.go(location);
} else {
  $state.go("user", {name: data.data.fullName, userId: data.data.userId});
}

http interceptor보다 더 좋은 방법이 있다고 생각합니다. 왜냐하면 그것은 요청 응답을 파싱하고 다른 페이지에 요청된 문자열이 있으면 오류가 발생하기 때문입니다.

나는 당신의 서비스에서 $http 메소드를 포장하고, 요청을 하기 전에 사용자가 로그에 기록되어 있는지 확인할 것을 제안합니다.

app.service('httpWrapper', ['$http','requestLogin',function($http,requestLogin){
  var httpWrapper = {};

  // You can add methods for put, post
  httpWrapper.get = function(url){
    // Before making the request, check with a request if the user is logged
    $http.get(urlLogged).success(function (auth) {
        if(!auth.logged){
            // Show login widget
            requestLogin.show();
        }
    }).error(function(){

    });        
    return $http.get(url);
  }

  return httpWrapper;
}]);

그런 다음 다른 서비스에서 $http 대신 httpWrapper를 사용합니다.

app.service('otherService', ['httpWrapper',function(httpWrapper){
  httpWrapper.get(url);
}]);

다음은 requestLogin 서비스입니다.

app.service('requestLogin', ['$rootScope',function($rootScope){
  var requestLogin = {};

  $rootScope.showlogin = false;

  requestLogin.show = function(){
    $rootScope.showlogin = true;
  }

  requestLogin.hide = function(){
    $rootScope.showlogin = false;
  }    
  return requestLogin;
}]);

그리고, 당신이 보기에:

<div ng-show="showlogin == true">
  Please log-in...
</div>

언급URL : https://stackoverflow.com/questions/29469249/handle-redirects-in-angularjs-http