NodeJS динамически загружать angular модули после входа в систему

Question

в первую очередь извините, но у меня нет большого опыта в npm, поэтому, пожалуйста, прости меня ^^

У меня есть http-сервер, который использует angular. Прямо сейчас я загружаю все когда-либо нужные модули прямо в индекс. html вроде:

<!-- internal js files -->
<script src="app.module.js"></script>
<script src="app.config.js"></script>

<script src="do/something.module.js"></script>
<script src="do/something.component.js"></script>
<script src="do/another_thing.module.js"></script>
<script src="do/another_thing.component.js"></script>

Поэтому, когда веб-сайт загружается, он также загружает все модули, не проверяя, что мне «разрешено видеть их». ». Это, в свою очередь, делает (imho) большой риск для безопасности, поскольку злоумышленник может видеть, что делает веб-сайт и как он вызывает частный API в модулях ...

Как я уже говорил, я не настолько опытен в этой области .. так что мне просто интересно: каковы общие практики? Как бы вы решили эту проблему?

Answer 1

Ленивая загрузка модуля AngularJs (v1.x) поддерживается $injector.loadNewModules (^ v1.6.x).

Этот пример предполагается, что angularjs v1.6.x & @uirouter/angularjs v1.x.x

Чтобы модуль Angular не находился внутри пакета приложения, он не должен быть частью дерева зависимостей приложения , это означает, что модуль angular admin не будет импортирован и использован как часть модуля app angular.

// router config

$stateProvider
  .state('admin', {
    abstract: true,
    url: '/admin',
    onEnter: /*@ngInject*/ (userService, $stateParams) => {
      return userService.getUserFromToken($stateParams.propertyId);
    },
    lazyLoad: $transition$ => {
             // this dynamic import tells webpack to split the admin-panel module (and it dependencies) from the app bundle
      return import(/* webpackChunkName: "admin" */ '../admin-panel/admin-panel.module').then(
        module => $transition$.injector().loadNewModules([module.AdminPanelModule],
      );
    },
  })
  .state('admin.main', { // inherits from admin abstract state
    url: '/',
    views: {
      '@': {
        component: 'dashboard',
      },
    },
  });

с этой конфигурацией состояния, когда ваше приложение будет перемещаться на любую из admin страниц (которая наследуется от абстрактного состояния admin) onEnter проверит, есть ли у пользователя разрешение на эту страницу, и тогда будет вызван lazyLoad (только в первый раз) Для загрузки admin.panel.module в модуль приложения.