代码之家 › 专栏 › 技术社区 › Roger Johansson

基于组成员身份显示内容-OKTA+ReactJS

okta-api okta reactjs

2

Roger Johansson · 技术社区 · 7 年前

我正在使用Okta对我的SPA(+Express后端)进行用户身份验证。如何使用Okta API根据组成员身份显示/隐藏内容?

e、如果我想显示一些菜单项,如果活动用户是特定组的成员。

Okta React SDK中有什么内容吗? 简而言之,产品看起来很棒,文档看起来没那么好。

我找到了这个API https://developer.okta.com/docs/api/resources/users.html#get-member-groups

然而,我不确定如何从我的应用程序中最好地使用它。我应该在何时何地调用它,我应该将组成员身份存储在某个对象中,然后将其传递给我的所有子组件吗?

欢迎提出任何想法和指导

1 回复 | 直到 7 年前

1

3

jmelberg 7 年前

通过指定 groups 范围,您可以返回活动用户被分配到。在React应用程序中,使用 @okta/okta-react 通过将以下内容传递到 Security :

<Security issuer={config.issuer}
          client_id={config.client_id}
          redirect_uri={window.location.origin + '/implicit/callback'}
          scope={['openid', 'email', 'profile', 'groups']}
          onAuthRequired={({history}) => history.push('/login')} >

示例代码取自 React Quickstart .

接下来,使用 getUser() 方法返回完整的用户对象 userInfo 应用程序编程接口。

this.props.auth.getUser().then(profile => {
  const groups = profile.groups;
  // Do your show/hide logic here
});

这需要在Okta OpenID Connect应用程序中进行额外配置才能接受 组 作为范围。更多信息 here (Creating Token with Groups) 和 here (Okta Answers) .