Представления на основе разрешений в AngularJS
Внедрение модуля разрешений на стороне клиента для панели управления CMS Grofers.
Я пишу это, чтобы немного понять, как я реализовал представления на основе разрешений в приложении angularJS и Django.
Проблема
Ограничьте контент, который может просматривать пользователь, и действия, которые пользователь может выполнять, на основе определенного набора разрешений.
Подход
Просто ограничьте контент, к которому пользователь может получить доступ, установив разрешения на различных уровнях. Мы применили необходимые разрешения на трех уровнях.
- Уровень URL:
На уровне URL мы ограничили доступ пользователя к представлению, если ему не разрешено переходить по этому URL. - Уровень элемента:
На уровне элемента мы можем либо отключить поле ввода, либо скрыть div или span, если пользователь не разрешен. - Уровень API:
Если какой-либо пользователь обращается к конечной точке API, что запрещено, выдает ошибку на стороне клиента.
Реализация
После завершения аутентификации Django перенаправляет пользователя на домашнюю страницу нашего приложения angular, предоставляя пользователю разрешения в сеансе.
Получение разрешений из сеанса.
Простая директива уровня атрибута для доступа к разрешениям от объекта сеанса.
Отображение разрешений на веб-интерфейсе.
Здесь мы создали глобальную константу, подобную приведенной ниже, для сопоставления разрешений, полученных из бэкэнда, с настраиваемыми именованными разрешениями во внешнем интерфейсе, чтобы упростить определение разрешений на уровне сущности, а также для применения нескольких разрешений с использованием только одной переменной, которая сохраняет код организован и прост для понимания.
Предположим, что если элемент имеет разрешение SELECT-ALL с MERCHANT, это означает, что ему разрешено просматривать это, если у него есть любое из трех разрешений, перечисленных в value. Это помогает, поскольку для доступа к одному и тому же объекту можно использовать несколько разрешений.
Разрешения для URL.
Установите объект данных, соответствующий каждому URL-адресу, чтобы установить разрешение, необходимое для доступа к URL-адресу.
Теперь все, что нам нужно сделать, это проверить перед загрузкой URL-адреса, разрешен ли пользователь, что можно сделать с помощью события $ stateChangeStart.
Разрешения на уровне элемента.
Директива уровня атрибута для отображения / скрытия или отключения / включения элементов.
Проверяет массив разрешений и показывает контент, есть ли у пользователя какие-либо разрешения, необходимые для просмотра этого элемента.
Заключение
Это позволило нам скрыть контент как на уровне URL, так и на уровне DOM. Кроме того, мы можем проверить статус входа в систему, написать собственный код для обработки различных элементов, таких как различные поля ввода, и проверить изменение разрешений, пока пользователь уже работает.
Если вы ищете более подробный ресурс по разработке системы аутентификации на основе разрешений в приложении AngularJS, обязательно ознакомьтесь с этим. ("Ссылка")