检查身份验证状态并重定向用户

Posted 2023-03-13

【中文标题】检查身份验证状态并重定向用户

【英文标题】：Checking for authentication status and redirecting user

【发布时间】：2017-09-23 02:29:37

【问题描述】：

在我的应用程序组件中，我想检查用户是否在加载后立即通过身份验证，如果没有立即将用户重定向到公共页面，而不是加载主页（个人资料）页面。我正在使用可以在这里找到的 Auth0 服务：link to GitHub file

问题是，我应该在constructor 还是ngOnInit 中运行它，为什么？

if (auth.isAuthenticated()) 
  router.navigateByUrl(...))

【参考方案1】：

您可能需要考虑将其添加到路由保护中，而不是将其添加到组件构造函数/ngOnInit 中。

我这里有一个例子：https://github.com/DeborahK/Angular-Routing

查看用户文件夹中的auth.service.ts 和auth-guard.service.ts 文件。这个例子没有使用 Auth0，但它确实有 Angular “管道”。

【参考方案2】：

一般来说，您应该避免将任何业务逻辑放在组件或指令的构造函数中。

为什么？

因为，在运行组件的构造函数时，Angular 尚未初始化该组件（或指令）可能具有的任何输入。因此，如果初始化逻辑依赖于其输入的值，那么这些输入将没有正确的值，从而导致业务逻辑不正确。

但是我的组件/指令初始化不依赖于它的输入！！

现在可能是这样，但是如果/当这种情况发生变化时，您现在必须记住将所有逻辑从 constructor 移动到 ngOnInit，这只是自找麻烦。然后，您会遇到这种不一致，其中一些组件使用构造函数进行初始化逻辑，而其他组件使用ngOnInit，并且这种不必要的不​​一致也只是在您的应用程序开发时自找麻烦。这与为什么强烈建议始终在所有服务上添加 @Injectable 装饰器的原因相同，即使您在技术上仅在您的服务使用依赖注入时才需要它 - 始终添加它，这样您就不会忘记在以后实际添加它确实需要。

TLDR；

为了保持一致性并避免以后出现调试问题，请仅在组件中使用构造函数来捕获可注入对象作为属性 - 将所有其他逻辑放在 ngOnInit 中。

注意

然而，正如@DeborahK 指出的那样，在这种特定情况下，如果不满足某个条件，您希望从本质上阻止组件被路由到，更好的解决方案可能是router guard. 路由器的此功能可防止如果不满足某些条件，则组件根本不会被初始化。

【参考方案3】：

您可以使用调用 API 创建工厂以检查登录

.factory('check_login_session', function ($rootScope,ApiService,ApiEndpoint ,$location,$cookies,$timeout) 
        return 
            success :  function(response) 

                var check_login =
                    wut_token : $cookies.user_details
                ;
              return ApiService.postModel(ApiEndpoint.Models.check_login,check_login).then(function (response) 
                    if (response.SUCCESS == "FALSE") 
                         $location.path("staticpage");
                      else 

                        return response.SUCCESS;
                    
                )

            
        
    );

在控制器中

check_login_session.success().then(function(res) 
            if(res == "TRUE")
               //do as you want
            
        );