问题标签 [angular-router-guards]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
11 浏览

angular-router - 角度路由器:路由未通过以下路径规则测试

给定以下代码:

和路线/activities/new

我希望路由器测试里面的规则LOCALIZED_PATHS,如果它返回false,测试下一个规则(path: /activities/new)并匹配。

目前正在发生的事情 - 根据谷歌开发控制台中的程序流程 - 它首先测试由ActivityIndexModule和返回的规则false,然后测试canActivate守卫并返回false,但最后没有导航到ActivityNewModule.

我错过了什么?我是否正确理解控制台中的流程,因为它应该在给定程序逻辑的情况下运行?

非常感谢您的宝贵时间。

0 投票
1 回答
121 浏览

angular - Angular 5在查询参数更改时显示浏览器警报

我有一个具有路由'/Item'的父组件项。

我有两个子组件名称Catalog组件和AddSize组件。

默认情况下,目录组件将使用 route 加载'/item?q=catalogue'。然后用户选择产品,然后路由将更改为'/item?q=add_size'并加载 AddSize 组件。

现在,如果浏览器单击浏览器后退按钮,则查询参数将从 更改'/item?q=add_size''/item?q=catalogue'

'/item?q=add_size'当用户单击路由浏览器警报中的后退按钮不起作用时,我遇到了问题。

保护服务和主机侦听器在这种情况下没有帮助,因为我在同一条路线上,并期望浏览器警报仅用于查询参数更改。

我们有任何替代解决方案吗?

0 投票
0 回答
866 浏览

angular - Ionic4 Angular AuthGuard 适用于主页,不适用于登录页面

我为我的网络应用程序创建了一个 Authguard,并分配了几个路由,如主页、登录、注册等。

预期行为:

  1. 主页 - 目的是在用户未登录时显示登录页面
  2. 登录,注册,忘记密码等 - 如果用户已经登录,则目的是将用户重定向到主页(如果用户在地址栏中键入 url,则避免将登录页面显示给已登录的用户)

实际行为:

  1. 如果没有登录的用户访问主页,他将被重定向到登录页面,但该页面不显示。

  2. 如果用户通过 URL 访问登录页面,则该页面不会再次显示。[无论用户是否登录]

  3. 如果我删除登录页面的 auth 保护,加载主页会将用户重定向到登录页面,并且页面会正确显示。

我的 AuthGuard 代码

编辑:路线:

我可以理解这里的问题是将 Authguard 分配给登录页面。但我无法确定导致问题的原因。你们中的任何人都可以指出我正确的方向吗?

0 投票
1 回答
569 浏览

angular - Angular ngrx:具有副作用的防护

如果这是一些问题的重复,我最近很抱歉,但我找不到任何解决我的问题的方法。

我有警卫,现在我需要从调用 http 服务并将用户重定向到错误状态的副作用中捕获错误。尝试添加catchError,但如果我从服务器端收到错误,我什至不会去那里。

守卫.ts

效果.ts

减速器.ts

0 投票
1 回答
2575 浏览

angular - Angular 路由的条件

首先,如果第一个用户已经登录第一个选项卡,它将重定向到仪表板,当第一个用户在同一个浏览器中打开第二个选项卡(粘贴登录 URL)时,它会自动重定向到仪表板而不进入登录页面。我有条件在哪里登录页面有未经身份验证的用户可以访问的特定路线,

登录组件.ts

在市场页面(在第二个选项卡中),用户可以返回到登录页面,但不幸的是,当我实现此[如果用户登录时重定向到仪表板][1],它将通过仪表板重定向(因为第一个用户已经登录),如何确定第二个选项卡上是否有不同的用户,当从市场页面返回时,它不会重定向到仪表板而是登录页面,我是否可以在路由上设置条件或使用 Authguard(CanActivate) ?

detail.login 组件

市场组件.ts

0 投票
1 回答
506 浏览

angular - 在 Angular 中,是否可以根据用户是否经过身份验证来加载不同的模块?

例如,如果用户通过了身份验证,URL:www.example.com 应该加载一个模块,否则它应该加载另一个模块。

我尝试过使用警卫,但它并没有像我预期的那样工作。

我对 Angular 很陌生。如果有人可以编写示例路由数组进行演示,将不胜感激。:)

如果用户未通过身份验证,我希望我的路由能够像下面这样工作:

否则,如果用户已通过身份验证,我希望我的路线能够像下面这样工作:

0 投票
2 回答
1913 浏览

angular - AngularFireAuth重定向问题与角度路由保护

亲爱的 stackoverflow 社区,

我有以下问题。我尝试将 FirebaseAuthentication 与 Angular7 一起使用,并尝试使用警卫保护路线,因此只有登录的用户才能访问/profile url。

我的登录名(login.component.ts)看起来像这样。首先,我导入AngularFireAuth并将其用于通过 Google、Facebook 或电子邮件登录。在ngOnInit方法中,我订阅了authState,因此我可以重定向到用户。这一切都很好。

登录组件.ts

在下一步中,我想为/profile url 编写一个AuthGuard ,这样只有登录的用户才能访问他们的个人资料。未登录的用户应首先重定向到/login

应用程序路由.module.ts

我的AuthGuard ( auth.guard.ts ) 看起来像这样,并且在内部使用了一个类AuthService ( auth.service.ts )。这个AuthService被注入并提供一个方法isAuthenticated。如果用户通过了身份验证,他应该看到他的个人资料,否则AuthGuard应该返回 false 并将他重定向到登录。

AuthGuard

AuthService看起来像这样,如果用户登录,它的方法isAuthenticated应该返回 true,否则返回 false

身份验证服务

如果我不在函数末尾添加这个虚拟返回 true ,他也会在我登录时将我重定向回/login。他还告诉我该函数没有返回值

错误。 函数需要返回值

所以我知道这个订阅在isAuthenticated方法中是不够的,但我很好奇检测用户是否登录的最佳解决方案是什么样的。

如果你们中的一个人有最佳实践类型的解决方案,如果他能告诉我,那就太好了。那里没有很多合适的教程。

与此同时,我将尝试继续在谷歌上寻找解决方案。我希望你们中的某个人可以帮助我解决这个问题。谢谢 :)

最好的问候简

0 投票
1 回答
14033 浏览

angular - Angular 6:页面离开时的简单确认

我需要制作一个简单的确认窗口,并且我看到了很多关于如何通过额外操作来做到这一点的示例(比如等到文件上传表单不是字段)。但是我只需要创建一个带有默认文本的默认确认窗口(如下图所示),以便在用户想要从当前页面离开时显示它。而且我无法完全理解我应该在处理before unload事件中证明什么逻辑。

图像示例

如果这是一个问题,我最近很抱歉,但是,我没有找到任何解决方案。所以我有:

例子.guard.ts

例子.component.ts

如果您提供代码示例,那就太好了,但我很感激任何帮助。

0 投票
2 回答
3173 浏览

angular - 基于 Angular 6 角色的根 url 路由

我正在尝试为我的根 url 实现基于角色的路由。例如,当用户登录时,我可以将他从 login.component 重定向到用户的仪表板页面。同样适用于管理员,也通过登录重定向到管理员仪表板页面。但是,如果用户打开 root url,如何使用角色重定向到特定的仪表板?

目前,我的根路由指向仪表板组件,该组件解析角色并重定向到所需的仪表板页面、用户或管理员。有没有办法消除仪表板组件?

应用路由.ts

仪表板路由.ts

测试 DashboardRedirect 组件:

我尝试使用守卫甚至解析器来实现它,但没有成功。当我打开我的应用程序的根页面时,它导航到仪表板,几秒钟后导航到相应的仪表板页面,但我想立即导航用户并且没有额外的组件。有什么建议吗?

0 投票
1 回答
1707 浏览

angular - 关闭垫子对话框后如何将返回值发送给 CanDeactivate Guard | Angular CanDeactivate Guard | 角度材料对话框

我正在使用 CanDeactivate Guard 找出未保存的更改,如果发生更改,我将在离开页面之前显示确认材料对话框。根据对话操作,我将返回布尔值。

CanDeactivateGuard.ts:

UnsavedChangesComponent.ts:

确认对话框.html:

确认对话.ts:

与确认方法相同。我想根据对话框操作返回值导航页面