0

我正在开发一个具有多个视图的项目，其中某些视图可能无法被给定用户访问。我想要做的是，如果用户导航到一个受限的 url（由于他的权限），让我们说'/project/manhatten/security' 我想显示一个视图（一个 html 部分），它只是说'拒绝访问'。

但我想在不更改 url 的情况下显示视图。我希望 url 保持'/project/manhatten/security'，所以用户可以复制 url 并将其提供给具有足够权限的人，这样就可以正常工作。

实现这一目标的最佳方法是什么？我仍然可以使用andng-view或结合使用ng-viewandng-include吗？

提前致谢。

4

1 回答 1

3

我不知道如何限制对角度特定视图的访问。我认为你不应该限制观点。您应该做的是限制对您的 api 的访问。因此，如果用户没有权限删除项目。当他调用 api 时，只需从服务器发送 401 即可。在客户端使用 $http 拦截器以角度处理这个 401。

我会做以下事情：

在您的 index.html 中创建一个元素/指令以显示错误消息

索引.html

  <div ng-controller=ErrorMessageCtrl ng-show=error.message>
    {{error.message}}

  <ng-view></ng-view>

当出现拒绝访问错误时，ErrorMessageCtrl 将收到通知：

.controller('ErrorMessageCtrl', function ($scope) {
  $scope.error = {}
  $scope.$on('error:accessDenied', function(event, message) {
    $scope.error.message = message
  })
})

创建一个拦截器服务来处理 http 401 auth 错误：

.factory('authErrorInterceptor', function ($q, $rootScope) {
  return {
    response: function (response) {
      return response
    },
    responseError: function(rejection) {
      if (rejection.status === 401) {
        $rootScope.$broadcast('error:accessDenied', 'Access Denied')
      }
      return $q.reject(rejection)
    }
  }
})

将拦截器服务添加到 $httpProvider

.config(function ($httpProvider, $routeProvider) {
  $httpProvider.interceptors.push('authErrorInterceptor')
  $routeProvider.when('/project/manhatten/security', {
    template: '<div><h1>Secure Page</h1>secure data from server: {{data}}</div>',
    controller: 'SecureDataCtrl'
  })
})

$http.get('/api/some/secure/data') 返回 401 http 状态码

.controller('SecureDataCtrl', function ($scope, $http) {
  $scope.data = 'none'
  $http.get('/project/manhatten/security')
    .success(function (data) {
      $scope.data = 'secure data'
    })
})

请记住，这是在 10 分钟内被黑客入侵的。你需要做一些重构。就像创建一个 errorMessage 指令，它会注入错误通知服务，而不是将错误消息广播到作用域。

于 2013-10-28T13:36:15.843 回答