AngularJS部分視圖安全

我試圖確保部分視圖，以便用戶不能在沒有登錄但切換時遇到麻煩的情況下切換視圖。代碼如下：AngularJS部分視圖安全

 var loginApp = angular.module('loginApp', [ 
      'ngCookies', 
      'ngResource', 
      'ngSanitize', 
      'ngRoute' 
     ]) 

    // 
    // 
    // 
    // -------------- Cannot get this to work ------------ 
    // 
    // 
    // 
    // loginApp.factory('authInterceptor', function ($q, $location) { 
    //  debugger; 
    //  return { 
    //   request: function (config) { 
    //    config.headers = config.headers | {}; 
    //    if (localStorage.auth_token) { 
    //     config.headers.token = localStorage.auth_token; 
    //    } 
    //    return config; 
    //   }, 
    //   responseError: function (response) { 
    // 
    //    if (response.status === 401 || response.status === 500) { 
    //     $location.path('/'); 
    //    } 
    //    return $q.reject(response); 
    //   } 
    //  } 
    // }) 
    // 
    // loginApp.config(function ($httpProvider) { 
    //  $httpProvider.interceptors.push('authInterceptor'); 
    // }) 


     loginApp.config(function ($routeProvider) { 
      $routeProvider 
       .when('/', { 
        templateUrl: 'views/login.html', 
        controller: 'loginController' 
       }) 

       .when('/expertView', { 
        templateUrl: 'views/b.html', 
        controller: 'bViewController' 
       }) 

     }); 


     loginApp.controller('bViewController', function ($scope) { 
        //$scope.message = 'Everyone come and see how good I look!'; 
     }); 



     var loginController = function ($scope, $http, $location) { 
      $scope.user = {}; 
      $scope.user.username = "name"; 
      $scope.user.userID = "123456"; 
      $scope.user.password = "444444444"; 
      $scope.user.ui = "true"; 

      $scope.user.submitForm = function (item, event) { 
       var data = { 
        userID: $scope.user.userID, 
        password: $scope.user.password, 
        ui: $scope.user.ui 
       }; 

       $http({ 
        url: '/api/v1/auth/login', 
        method: "POST", 
        dataType: "json", 
        data: data, 
        headers: { 
         'Accept': 'application/json, text/javascript', 
         'Content-Type': 'application/json; charset=utf-8' 
        } 

       }).success(function (data, status, headers, config) { 
        console.log("Success!"); 
       }).error(function (data, status, headers, config) { 
        console.log("Submitting to Server failed!"); 
       }); 
      } 
     }

我只需要確保視圖，並確保用戶不能（切換）訪問視圖沒有登錄。

來源

2014-09-23 New2JQ

當你說你不能讓它起作用，你究竟是什麼意思？你得到了什麼樣的錯誤，或者你看到了什麼行爲？ – Josh 2014-09-23 20:50:24

那麼代碼將內容類型轉換爲純文本並停止http發佈。我只需要一個簡單的方法來保護意見。我無法搞清楚。 – New2JQ 2014-09-24 01:48:30

這裏有一個很好的解釋： http://stackoverflow.com/questions/21255203/angularjs-clientside-routing-and-token-authentication-with-webapi – New2JQ 2014-09-24 02:15:12

首先創建一個可確定，例如每條路線的訪問級別恆定

angular.module("App") 
.constant('USER_ROLES', { 
    logedIn : 'true' 
});

然後在運行功能檢查它們添加到路由的定義

.when('/write',{ 
    templateUrl:'templates/write.html', 
    access_level:USER_ROLES.logedIn 
})

之後$rootScope.$on('$locationChangeStart'事件，在裏面你可以通過var location = $location.path(); var route = $route.routes[location];訪問路由，然後通過route.access_level;訪問用戶角色

來源

2014-09-23 21:17:21 MohamedAbbas

十分感謝。你可以把它放在上面的代碼中，以便我可以一起看到它。這將非常有幫助。 – New2JQ 2014-09-24 01:40:17

AngularJS部分視圖安全

回答

相關問題