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

通过指定 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) .