Apresentando @rxweb/angular-router: Lide com roteamento angular melhor 🚀

Apresentando @rxweb/angular-router: Lide com roteamento angular melhor 🚀

Nó Fonte: 1782302

O roteador angular ser capaz de construir aplicativos SPA com suporte a várias rotas oferece a vantagem de usar um único HTML com todas as funcionalidades em todo o aplicativo e renderizar a interface do usuário com base na rota, além de configurar guardas de rota para conceder e remover o acesso, o que é muito legal .😀

Outros aspectos a serem observados no desenvolvimento de uma aplicação com segurança de ponta são autenticação e autorização de forma que sejam realizadas separadamente e também de forma concentrada, um único guarda para gerenciar os acessos e um manipulador de ações pré-rota para gerenciar os dados de a aplicação, como isso é gerenciado em uma aplicação angular e quais são os desafios de alto nível enfrentados?????🤨

O que não está presente?

  1. Orientação Central para lidar com autorização e autenticação pré-rota com separação de interesses
  2. Resolver globalmente o usuário antes da inicialização do componente
  3. Gerenciar globalmente o acesso com base na função do usuário
  4. Individual CanActivate para todas as rotas para lidar com regras de negócios complexas separadamente
  5. Middlewares de nível global e de componente

Por que @rxweb/angular-router ?

  • Um decorador que é declarado no módulo raiz com a função de lidar com autenticação, autorização e middlewares em todo o aplicativo são gerenciados individualmente
  • Um único guarda CanActivate com todas as rotas
  • Verificação de acesso inteligente ao componente
  • Criptografia de URL centralizada

de @rxweb/roteador angular

O que é @rxweb/angular-router ?

@rxweb/angular-router é um pacote para gerenciar rotas em uma aplicação angular juntamente com autorização, autenticação de forma intuitiva e segregada.

Ele vem com simplificação de ações a serem feitas sempre que o usuário redireciona para a rota e os dados são renderizados, o que aumenta a Manutenção do módulo do roteador em nosso aplicativo angular e ajuda a evitar o uso de vários guardas enquanto faz o aplicativo consistente.

O uso

Instalação:

npm instala @rxweb/angular-router

Adicione o seguinte na instrução de importação no app.module.ts

import { RxRoutingModule } from '@rxweb/angular/router';

Conforme discutimos, veremos como usar globalmente autorização, autenticação e middlewares usando um único decorador @routerModule.

A @routerModule é declarado no app.module.ts como abaixo

@routerModule({ authentication:, authorization :, middlewares : [] })
@NgModule({...})
export class AppModule { }

Vamos, um por um, adicionar valores a essas propriedades pelo tutorial listado abaixo:

Da mesma forma que iremos https://www.codementor.io/@ushmidave905/simplified-way-to-perform-authentication-in-angular-routing-1ecfy6paac?published=1

Para implementar a Autorização, consulte Maneira simplificada de realizar Autenticação em Roteamento Angular

Conclusão

Neste artigo aprendemos sobre @rxweb/angular-router e seus benefícios e as partes do tutorial da implementação em @routerModule, juntamente com a implementação global, ele também contém autorização baseada em diretivas, middlewares baseados em componentes e nível de acesso.

Carimbo de hora:

Mais de Codementor Angular