问题标签 [angular-route-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 回答
1674 浏览

angular - 可观察的> 到可观察的

RxJS 新手在这里。使用 Angular 6。试图弄清楚如何Observable<T>Observable<Observable<T>>. 不确定这是否有效并且难以从概念上理解它,但这似乎是一个简单的问题。

我研究了 switchMap、flatMap、forJoin,但我认为它们不符合我的需求。

我正在尝试做的是一个 Angular 路由保护,它将阻止用户访问路由,除非他们拥有必要的权限。2个依赖项是一个用户配置文件,用于获取他们的信息,然后用于获取他们的权限。这种混合导致了 Observable 的 Observable 问题。这是我所拥有的:

非常感谢!!

0 投票
1 回答
149 浏览

angular - Angular / Firestore - 登录屏幕的路由保护 - 是否可以检查尝试访问路由的用户?

我有一个角度应用程序和一个路由守卫。

如果用户在domain.com/login登录时结束,我想将他们转发到另一条路线。

但是,一个用户帐户在 firestore ( admin: true) 中具有“admin”属性。登录后,我会检查 login.component.ts 以查看用户帐户上的 Firestore 节点是否存在。如果是这样,我会将它们转发到管理面板。如果没有,那么它表明它是一个客户端传入并将它们重定向到另一个组件。

但是,我目前遇到的问题是,如果用户在登录时最终出现在登录屏幕上,我不确定如何将用户重定向到适当的组件。到目前为止,下面是我的后卫。如您所见,路由器导航中有一个问号,因为我不确定如何确定它是否是管理员。

0 投票
1 回答
117 浏览

angular - 在 Angular 应用程序中将导航相关代码放在哪里?

目前我在我的 AuthGuard 构造函数中订阅了下面的 redux 状态更改。它只会重定向到登录后请求的原始页面。这不是正确的地方,但我不知道它应该在哪里:

auth.guard.ts:

我还有其他与导航相关的东西,如下所示。这目前在一个服务中,应该管理不同的浏览器窗口并在它们之间进行状态同步:

两者都可以在核心或 app.component.ts 中的新 navigation-service.ts 中。我读了一篇关于不订阅角度服务的文章,所以可能不是服务。将所有内容都放在 app.component 中听起来是个坏主意。我想把所有与导航相关的东西放到它自己的地方来分开关注点。推荐的方式是什么?

0 投票
2 回答
1391 浏览

angular - 用户登录 Angular 6 后,如何使用 CanActive/CanDeactive 路由保护来限制用户导航回打开未经授权的页面

我有两条开放路线(例如:/home、/details)。用户登录后,我想限制用户访问这些页面,直到他注销,通过直接更改 URL 或点击返回按钮。

我使用 AuthGuard 来限制用户在未登录时访问受保护的路线。

0 投票
2 回答
57 浏览

angular - 角度 authguard 重定向到 /

如果用户对象为空,我已经更改了我的 authguard 以获取用户对象。我只是将令牌存储在存储中。我看到console.log“角色和用户正常”和正确的url /member,但它总是将我重定向到/而不是/member。

身份验证服务

谢谢

0 投票
2 回答
62 浏览

angular - 如何一起使用Required和Query参数 - 查询参数为空

所以我试图导航到时间表路线。

该路由将员工的姓名作为路由器参数,将开始和结束日期作为查询参数。

我的 route.js 看起来像这样:

当我尝试点击 REST 后端时形成的 URL 在 start_date 和 end_date 中具有空值。

我已经检查过我为开始日期和结束日期传递的值都不为空。

有什么想法我在这里做错了吗?提前致谢...

0 投票
1 回答
254 浏览

rxjs - canActivate routeguard 使用 switchmap 操作符嵌套 observables 仅适用于浏览器

我正在使用带有身份验证和firestore的firebase。经过身份验证的用户在注册时存储在数据库中,其中一些用户具有“管理员”角色的额外角色字段。我想保护管理员路由,我使用 canActivate 路由保护。在 canActivate 函数中,我使用了 2 个 observables。第一个 1 获取登录用户并嵌套在另一个从 firestore 获取已保存用户的 observable 中,如果登录用户是否为管理员,则使用来自那里的信息。问题是当浏览器在浏览器中的路由类型之后刷新时路由保护工作正常,但是当使用按钮上的 routerlink 调用路由时,什么也没有发生。

尝试使用 sycnronous 值,但这些值只工作一次,并且在导航后停止工作。

canActivate 函数: https ://i.imgur.com/Rf0BZ79.png

使用的观测值: https ://i.imgur.com/hRp8zyf.png https://i.imgur.com/oV56AGl.png

// 用户对象或来自 firebase 的 null

//检查角色并返回true或false(userArr是一个可观察的用户数组,用于存储来自firestore的用户)

因此,这仅在我在浏览器中键入路径并且在加载路由时浏览器刷新时才有效。当我单击管理按钮导航到管理页面时它不起作用(不适用于 routerLink 或 router.navigate(..))

0 投票
2 回答
1380 浏览

angular - 等待 Angular 路由保护中返回的值

我将 Ionic 与 Angular 一起使用。在我的一个路由守卫中,我需要查看是否创建了 Firestore 文档并为其返回一个布尔值,这需要一些时间才能从服务器获得响应,但是路由守卫不会等待该值返回并正常运行,因此页面不受保护!我怎样才能让路由守卫等待值?或者,在路由保护运行之前返回值?这是我向firestore发送请求的地方:

这是我的路由保护代码,我将它用于我的页面:

0 投票
1 回答
239 浏览

angular - 实施 Angular 8 Route (Auth) Guards 时出错

所以我试图为我的 web 应用程序实现 Route Guards,但遇到了很多错误。我做错了什么?

我的 webapp 由多个路由组成,其中一个是仪表板,需要通过登录组件进行保护。这正是我尝试实施但失败的方法。我的登录组件从后端生成一个 JWT 令牌并将其添加到 LocalStorage(以对象“令牌”的格式:“”)。

我的dashboard.component.ts:

我的 auth.guard.ts:

我的 can-exit.guard.ts:

我的 canExit.ts:

浏览器中的错误是:

更新:StackBlitz: https ://stackblitz.com/edit/angular-v9u7nw?file=src%2Fapp%2Fapp.routing.ts

0 投票
0 回答
32 浏览

firebase-authentication - Angular Firebase 路由守卫

我想添加一些基于 Firebase authdisplayName属性的路由保护。

但这个功能不起作用。

如何正确执行此操作?