如何在使用 auth0 进行身份验证的反应应用程序中获取用户信息

Posted 2023-02-24

【中文标题】如何在使用 auth0 进行身份验证的反应应用程序中获取用户信息

【英文标题】：How to get user info in a react app which uses auth0 for authentication

【发布时间】：2018-04-16 12:16:00

【问题描述】：

我试图在 auth0 中使用 twitter 从登录中获取用户信息。 auth0 提供 userInfo api 来获取用户详细信息，但它只是返回一个带有子键的对象（例如 - "sub":"twitter|XXXXXXXXX" ）。根据提供的documentation，我们应该得到名字、图片、昵称等，在我的例子中只有一个 sub 正在返回。我想知道如何在 auth0 中获取用户的详细信息。

编辑 - 提供使用的配置。

auth0 = new auth0.WebAuth(
        domain: AUTH_CONFIG.domain,
        clientID: AUTH_CONFIG.clientId,
        redirectUri: AUTH_CONFIG.callbackUrl,
        audience: `https://$AUTH_CONFIG.domain/userinfo`,
        responseType: 'token id_token',
        scope: 'openid'
    );

【问题讨论】：

您看到的 sub 是 user_id 属性 - 您是否查看过用户配置文件端点（此处：auth0.com/docs/api/authentication#user-profile）？您是否为访问令牌的范围提供了openid？您是否申请分享您拨打电话的代码？

是的，范围就是重点。我已将scope 指定为 'openid'。但是当我刚刚将scope 更改为 'openid profile' 时，它起作用了。谢谢！

太棒了！ :) 很高兴它起作用了。

【参考方案1】：

该问题未提供有关您如何通过 Twitter 社交连接发出身份验证请求的任何详细信息。至少，建议您尝试将scope: openid profile email 添加到您的身份验证请求中。这将确保返回的 id_token 包含所有符合 OIDC 的用户配置文件属性（声明）。

详情请见documentation。

如果您访问auth0 dashboard social connections，您可以看到 twitter 返回到 Auth0 的内容。启用 OIDC 一致性后，您至少可以看到基本信息，例如 sub（用户 ID）、name 和 picture。下面的屏幕截图 - 请确保您勾选了基本个人资料用户同意复选框。

【讨论】：

auth0 = new auth0.WebAuth( domain: AUTH_CONFIG.domain, clientID: AUTH_CONFIG.clientId, redirectUri: AUTH_CONFIG.callbackUrl, audience: https://$AUTH_CONFIG.domain/userinfo, responseType: 'token id_token', scope: 'openid' ); 这是配置。正如@kimcodes 提到的范围，我发现问题出在范围内并修改为 openid profile 它起作用了。

@manjs - 请您将此答案标记为正确 - 已强调需要添加 openid profile email - 这将有助于其他访问此问题的人相信所提供的答案 - 免责声明，我也在Auth0 ;)