然而

Question

我正在添加一个对我的restful app具有只读权限的新用户个人资料。

我的应用仅使用获取和发布请求（不会放置，删除等）

具有只读访问权限的用户无法创建，编辑或删除任何内容数据（只能查看数据）。换句话说，无法执行任何 POST 请求 - 此用户只能发出 GET 请求。

我需要编写一个指令来拦截任何发布请求并产生错误（＆＃34;不允许进行只读访问＆＃34;）如果点击发出发布请求的按钮。

我的目标是将指令添加为表单中的属性（例如）。像这样：

<form restrictReadOnly name="form1" class="form-horizontal" novalidate>...

我已经开始了，但不知道从哪里开始：

directive('restrictReadOnly', function() {
    'use strict';

    return {
        restrict: 'A',
        controller: 'restrictReadOnlyCtrl',
        link: function(scope, element, attrs) {
        //.................

Answer 1

我认为，这里有几点要做。我会尽力回答你的问题。

首先，我只想指出限制前端访问通常不是一个好的安全措施（前端的任何代码都可以由用户操纵。如果用户仍然拥有POST权限服务器，即使它在客户端受到限制，也有办法解决这个问题。）因此，如果这是一个关于限制用户访问的严重问题，我肯定会建议在服务器上执行此操作，而不是客户。

其次，我将回答主要问题。有几种方法可以拦截请求。通常的方法是使用interceptor (blog post by Ben Nadel)。由于您的问题要求您出于某种原因使用指令，我可能会建议在表单提交时通过$ rootScope发送事件，HTTP拦截器将查看该事件并完成或停止请求。但是，我认为更好的方法就是使用拦截器（并且没有指令）如果您要做的就是限制所有POST请求。

所以，你的指令：

// inject $rootScope as a dependency first
link: function(scope, $el, attrs) {
  $el.on('submit', stop);

  function stop() {
    e.preventDefault();
    $rootScope.$broadcast('request.restricted', $el);

    return false;
  }
}

然后，你的拦截器：

config.$inject = ['$httpProvider'];

app.config(config);

function config($httpProvider) {
  $httpProvider.interceptors.push(interceptor);

  interceptor.$inject = ['$q', '$rootScope'];

  function interceptor($q, $rootScope) {
    var cancel = $q.defer();

    return {
      request: request
    };

    function request(config) {
      $rootScope.$on('request.restricted', stop);

      function stop() {
        config.timeout = cancel.promise;
      }

      return config;
    }
  }
}

请参阅this question that says how to stop a request from completing.

然而

我真正建议的是使用拦截器来检查所使用的方法是否为POST，如果是，请停止请求。 无需指令。

config.$inject = ['$httpProvider'];

app.config(config);

function config($httpProvider) {
  $httpProvider.interceptors.push(interceptor);

  interceptor.$inject = ['$q'];

  function interceptor($q) {
    var cancel = $q.defer();

    return {
      request: request
    };

    function request(config) {
      if(config.method.toLowerCase() === 'post') {
        config.timeout = cancel.promise;
      }

      return config;
    }
  }
}

更好的是，在服务器上执行

Answer 2

好吧，我不确定如何使用指令实现这一点。但是，我有另一种选择，请查看它是否可以解决您的问题。

代替指令向这些表单添加类或数据属性。我们添加一个类“restrictReadOnly”

现在，在你的html绑定那些发布帖子的函数中，让我们说出类似下面的内容

$scope.postSubmit = function() {
     // now get your form element which was under process.
     // Check if that class is specified, if yes do error handling, else continue;
};

如何编写限制帖子请求的指令

2 个答案:

然而

更好的是，在服务器上执行