我如何在 Apollo 中 return 用户对象的 id 属性？

Question

当我将以下内容放在查询用户模型的 React 组件中时，我能够获得 graphQL 查询的整个用户对象，包括 id 属性:

console.log(this.props.data.user)

但是当我尝试从代码访问 ID 属性时：

console.log(this.props.data.user) // undefined 
console.log(this.props.data.user.id)
 // error cannot get property of undefined

我的第一个猜测是这是一项安全功能；我正在使用 Auth0 和 Graphcool。

但我可能只是在倒退。如果是这样，我们将不胜感激任何有关以正确方式访问用户 ID 的帮助。

谢谢

Answer 1

这在 FAQ article on the logged in user 中有介绍。

使用 Auth0 获取签名的 JWT

user 查询returns 当前通过身份验证的用户。所以首先我们要考虑的是如何确定认证用户。

当前 state-of-the-art 是 using verified JWT 并将它们作为 Authorization header 传递。

在 Auth0 Lock 中输入有效凭据后，它 returns 一个用您的 Auth0 秘密密钥签名的 JWT。这个签名的 JWT 被发送到 GraphQL 服务器，我们将在其中使用您的 Auth0 密钥对其进行验证，如果它属于有效用户，则请求已通过身份验证。

使用 Apollo Client

设置 Authorization Header

所以我怀疑您只是没有传递有效的 Authorization header。使用 Apollo，您可以使用它来确保传递令牌（如果存在）。请注意，我们将使用本地存储来存储来自 Auth0 Lock 的令牌：

const networkInterface = createNetworkInterface({ uri: 'https://api.graph.cool/simple/v1/__PROJECT_ID__' })

// use the auth0IdToken in localStorage for authorized requests
networkInterface.use([{
  applyMiddleware (req, next) {
    if (!req.options.headers) {
      req.options.headers = {}
    }

    // get the authentication token from local storage if it exists
    if (localStorage.getItem('auth0IdToken')) {
      req.options.headers.authorization = `Bearer ${localStorage.getItem('auth0IdToken')}`
    }
    next()
  },
}])

const client = new ApolloClient({ networkInterface })

检查 this Auth0 example code or the live demo 以了解其工作原理。

您可能还对this answer on authorization (permissions)感兴趣。

我如何在 Apollo 中 return 用户对象的 id 属性？

How do I return the id property of the user object in Apollo?

reactjs

graphql

auth0

apollo

graphcool

使用 Auth0 获取签名的 JWT

使用 Apollo Client