2013-09-06 3 views
14

Я очень новичок в AngularJS, и теперь трачу 3 дня на поиск способа управления статусом 401. Я пробовал перехватчики, используя $ http, используя $ resource ... но ничего не работает. Мое приложение вызывает вызов JSONP на том же сервере. при возникновении ошибки она попадает в функцию обратного вызова ошибки. но статус всегда равен 0, а ответ не определен.401 несанкционированная обработка ошибок в AngularJS

Во-первых, я попробовал этот перехватчик

app.config(['$httpProvider', function($httpProvider) { 
$httpProvider.responseInterceptors.push(['$q', function($q) { 
    return function(promise) { 
     return promise.then(function(response) { 
      console.log('success in interceptor'); 
      return response; 
     }, function(response) { 
      console.log('error in interceptor'); 
      console.log(response); 
      if (response.status === 401) { 
       response.data = { 
        status: false, 
        description: 'Authentication required!' 
       }; 
       return response; 
      } 
      return $q.reject(response); 
     }); 
    } 
}]); 
}]); 

Во-вторых, также пытались в контроллерах с помощью $ ресурса

$scope.fetchData = function(fromDate, toDate){ 
     Cancel.get({from: fromDate, to: toDate, perPage: 99999}, 
        function(data){        
         $scope.cancels = $scope.filteredCancels = data.data; 
         $scope.search(); 
        }, 
        function(response) { 
         $scope.errorMessage = '<h4>Error : '+response.status+'</h4>'; 
         window.location = "/"; 
        });    
     }; 

В-третьих, попытался с помощью $ HTTP вместо $ ресурса

$scope.fetchData = function(fromDate, toDate){ 
    $http.jsonp('http://host:8900/api/cancellations?callback=JSON_CALLBACK') 
     .success(function(data, status, headers, config) { 
      console.log(status); 
      }) 
     .error(function(data, status, headers, config) { 
      console.log(status);    
      }; 

Вот информация заголовка для вызова JSONP

Request URL:http://host:8900/api/cancellations?callback=angular.callbacks._0 
Request Method:GET 
Status Code:401 Unauthorized 
Request Headersview source 
Accept:*/* 
Accept-Charset:ISO-8859-1,utf-8;q=0.7,*;q=0.3 
Accept-Encoding:gzip,deflate,sdch 
Accept-Language:en-GB,en-US;q=0.8,en;q=0.6 
Cache-Control:max-age=0 
Connection:keep-alive 
Cookie:__utma=149207145.339724205.1374885003.1377550245.1378313049.3; __utmc=149207145; __utmz=149207145.1378313049.3.2.utmcsr=cyphersmart.qc3deva.electricmail.com:8900|utmccn=(referral)|utmcmd=referral|utmcct=/; remember_username=elie.kim%40electricmail.com; PHPSESSID=gdoemlp5jltqq62etc5gfuh653; cookie=cookiecheck; __utma=1.789184132.1378340585.1378499390.1378504453.10; __utmb=1.3.10.1378504453; __utmc=1; __utmz=1.1378340585.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none) 
Host:host:8900 
Referer:http://host:8900/reports/cancels/ 
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.22 (KHTML, like Gecko) Ubuntu Chromium/25.0.1364.160 Chrome/25.0.1364.160 Safari/537.22 
Query String Parametersview sourceview URL encoded 
callback:angular.callbacks._0 
Response Headersview source 
Cache-Control:no-store, no-cache, must-revalidate, post-check=0, pre-check=0 
Connection:keep-alive 
Content-Type:application/json; charset=utf-8 
Date:Fri, 06 Sep 2013 22:02:13 GMT 
Expires:Thu, 19 Nov 1981 08:52:00 GMT 
Keep-Alive:timeout=20 
Pragma:no-cache 
Server:nginx/0.7.65 
Transfer-Encoding:chunked 

Я не мог найти способ справиться с несанкционированным статусом 401, однако я все связал. Было бы очень признательно, если бы я мог получить совет или добрый совет.

+0

если вы перейдите по своему URL-адресу в браузере, что происходит? – akonsu

+0

Какую версию углового вы используете? Это важно, потому что «responseInterceptors» изменился в 1.2 – TheSharpieOne

+0

@TheSharpieOne моя версия v1.0.6. это причина? –

ответ

4

я должен был сделать очень похоже в последнее время, вот мой перехватчик

app.factory("HttpErrorInterceptorModule", ["$q", "$rootScope", "$location", 
    function($q, $rootScope, $location) { 
     var success = function(response) { 
      // pass through 
      return response; 
     }, 
      error = function(response) { 
       if(response.status === 401) { 
        // dostuff 
       } 

       return $q.reject(response); 
      }; 

     return function(httpPromise) { 
      return httpPromise.then(success, error); 
     }; 
    } 
]).config(["$httpProvider", 
    function($httpProvider) { 
     $httpProvider.responseInterceptors.push("HttpErrorInterceptorModule"); 
    } 
]); 

модифицирована небольшое для случая использования

2

Следит аналогичное решение ...

angular.module('myApp', ['myApp.services', 'myApp.directives'], function ($routeProvider, $locationProvider, $httpProvider, $location) { 

    var httpInterceptor = ['$rootScope', '$q', function (scope, $q) { 

     function success(response) { 
      return response; 
     } 

     function error(response) { 
      var status = response.status; 

      if (status == 401) { 
       $location.url('/login'); 
       return; 
      } 

      return $q.reject(response); 

     } 

     return function (promise) { 
      return promise.then(success, error); 
     } 

    }]; 
    $httpProvider.responseInterceptors.push(httpInterceptor); 
}); 
+0

$ httpProvider.interceptors.push ("HttpErrorInterceptorModule"); – Krack

2

В случае любой вызов API возвращает 401, мы должны перенаправить пользователя на страницу входа. HTTP-перехватчик Angular отлично подходит для этой работы. Как вы можете видеть из app.js выше, это были вытеснены к трубе здесь:

httpProvider.responseInterceptors.push('httpInterceptor'); 

Реализация перехватчик сама,

'use strict'; 

angular.module('dashboardApp').factory('httpInterceptor', function httpInterceptor ($q, $window, $location) { 
    return function (promise) { 
     var success = function (response) { 
      return response; 
     }; 

     var error = function (response) { 
      if (response.status === 401) { 
       $location.url('/login'); 
      } 

      return $q.reject(response); 
     }; 

     return promise.then(success, error); 
    }; 
}); 
+0

Как вы показываете пользователя при перенаправлении на путь location.path (/ login), почему он вышел из системы? – maumercado

4

Принятая ответ не работает для более поздних версий угловой. Использование 1.5.x (и, возможно, даже раньше), вы должны написать перехватчик по-разному:

// http interceptor to handle redirection to login on 401 response from API 
app.factory('httpResponseInterceptor', ['$q', '$rootScope', '$location', function($q, $rootScope, $location) { 
    return { 
     responseError: function(rejection) { 
      if (rejection.status === 401) { 
       // Something like below: 
       $location.path('signin/invalidSession'); 
      } 
      return $q.reject(rejection); 
     } 
    }; 
}]); 

Наносить:

app.config(function($httpProvider) { 
    $httpProvider.interceptors.push('httpResponseInterceptor'); 
}); 

Смотрите здесь для получения дополнительной информации https://docs.angularjs.org/api/ng/service/ $ HTTP # перехватчиков

Смежные вопросы