检查用户登录的页面是否在Angular 2中进行了更改

舒里克·阿古良斯基

Angular2会缓慢但确实会进展。现在,我面临以下挑战。我想检查用户是否在每个页面上都进行了更改(换句话说,在每个组件的负载下)。当然,我可以在每个接口中实现OnInit接口,但这就是代码味道。

有什么有效的方法可以执行应用程序每个页面上所需的任何内容?我很想听听有关如何处理此任务的最佳做法的其他建议。

我正在使用该库(https://auth0.com/blog/2015/11/10/introducing-angular2-jwt-a-library-for-angular2-authentication/)进行基于jwt的登录,并且我已经有了不错的服务封装所有与身份验证相关的功能的类。因此,已经完成并测试了用户是否登录的实际检查。

谢谢,

蒂埃里圣堂武士

如果您使用路由(由于您说:“每次页面更改”,情况似乎都是这样),则可以利用以下几项:

  • 创建一个自定义路由器插座(的子类RouterOutlet),以检查其activate方法的身份验证在这种情况下,您可以拥有全局的东西。像这样:

    @Directive({
      selector: 'auth-outlet'
    })
    export class AuthOutlet extends RouterOutlet {
      (...)
    
      activate(oldInstruction: ComponentInstruction) {
        var url = this.parentRouter.lastNavigationAttempt;
        if (isAuthenticated()) {
          return super.activate(oldInstruction);
        } else {
          (...)
        }
      }
    }
    

    有关更多详细信息,请参见此问题:

  • 利用CanActivate装饰器检查组件是否可以激活。您可以在此级别执行身份验证检查。

  • 还可以在RouterLink级别执行某些操作以显示/隐藏路由链接。在这种情况下,您可以根据相关的路由配置和当前用户提示在这些链接上应用角色。有关更多详细信息,请参见此问题:

这也可以在HTTP拦截器(扩展该类的类Http)中进行处理。在这种情况下,执行请求时,您可以插入一些身份验证检查:

@Injectable()
export class CustomHttp extends Http {
  constructor(backend: ConnectionBackend, defaultOptions: RequestOptions) {
    super(backend, defaultOptions);
  }

  request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> {
    console.log('request...');
    if (isAuthenticated()) {
      return super.request(url, options).catch(res => {
        // do something
      });        
    } else {
      // Redirect to login page
      // Or throw an exception: return Observable.throw(new Error(...));
    }
  }

  (...)
}

有关更多详细信息,请参见此问题:

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

函数可以知道它们是否已经在Python(joblib)中进行了多进程处理

如何知道jtextarea中是否进行了任何更改?

如何修改并检查是否在Java 8中进行了修改?

检查ConcurrentHashMap的computeIfAbsent是否进行了更改

检查用户是否仍在angularfire2中进行了身份验证

检查用户是否对某项投票进行了投票

vscode是否在git commit消息框中进行了拼写检查?

如何知道服务人员是否在gatsby-plugin-offline中进行了更新

如果进行了任何更改,如何在离开Angular 4页面时提示用户?

检查元素是否在Angular2中对attr / class进行了动态标记

我怎么知道,UITextField和UITextView中是否进行了任何更改/修改?

检查客户是否对Woocommerce中的产品进行了评论

Vulkan-HPP开发人员是否在vk :: DebugUtilsMessengerEXT创建中进行了任何更改?

在关闭Angular材质对话框之前,检查用户是否对Reactive表单进行了更改

FireDac SQLite是否在Delphi 10.4中进行了更改?

Bash评估在版本4.4中进行了更改?

magento如何检查用户是否在订单页面中登录

检查Git是否以编程方式进行了更改

如何检查rsync是否对bash进行了任何更改?

即使我在LoginURL web.config中进行了设置,也无法重定向到登录页面

客户端检查是否在Firebase中进行了身份验证

检查onbeforeunload中的ace编辑器以查看是否进行了更改

数组是否在 jOOQ 和 PostgreSQL 中进行了优化?

检查用户是否对范围进行了投票

依赖顺序是否在应用程序中进行了任何更改?

SoX 中的 noiseprof 是否对声音进行了平均测量?

Http 调用在 angular 通用中进行了两次

扫描是否在记忆游戏中进行了所有匹配

检查玩家是否已经在 RPS 中进行了移动