Question

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

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

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

先谢谢。

Answer 1

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

我会做以下事情：

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

<强>的index.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指令一样，该指令获取注入的错误通知服务，而不是将错误消息广播到范围。

Angular - 在不更改URL的情况下加载视图

1 个答案: