Question

我在我的应用程序中有登录/创建帐户。我希望如果用户已经登录，用户将无法看到登录/创建帐户。我正在使用Authguard来保护路线：

@Injectable()
export class AuthGuard implements CanActivate {

    constructor(private router: Router) { }

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {debugger;
        if (localStorage.getItem('UserLoggedIn')) {
            // logged in so return true
            this.router.navigate(['']);
            return true;
        }

        // not logged in so redirect to login page with the return url
         this.router.navigate(['login']);
         return false;
    }

在这种情况下，页面将进入无限循环。

这是我的路线：

const appRoutes: Routes = [
  { path: '', component: HomeComponent , data: { animation: '' }},
  { path: 'login', component: UserloginComponent , data: { animation: 'login' },canActivate:[AuthGuard]},
  { path: 'create-account', component: CreateAccountComponent, data: { animation: 'create-account' } },
  { path: 'forgot-password', component: ForgotPasswordComponent, data: { animation: 'forgot-password' } },
  { path: '**', component: PageNotfoundComponent }
];

请帮助。我希望它用于登录和创建帐户。

Answer 1

这是因为您已将rules: { shop_name: { minlength: 4, remote: { type: 'POST', url: window.location.origin + '/api/shop/', dataFilter: function (data) { result = $.parseJSON(data); return result.exist; }, }, required: true } },添加到您的authguard，并且此authguard已附加到this.router.navigate(['login']);路由。每次访问路线时，它总是呼叫所有附加的警卫。因此，在您的情况下，如果您访问登录，它将无限重定向到登录。有很多方法可以解决您的问题。如果您打算在登录路线上添加防护，只需删除login以避免无限循环。但我建议只在用户未登录时将保护添加到您要保护的路由中。

Answer 2

试试这个：

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {debugger;

        let redirect: boolean = false;

        if (localStorage.getItem('UserLoggedIn')) {
            // logged in so return true
            this.router.navigate(['']);
            redirect = true;
        } else {
            // not logged in so redirect to login page with the return url
            this.router.navigate(['login']);
            redirect =  false;
        }


        return redirect;

    }

如何保护angular4中的路线

2 个答案: