如何在Graphcool的GraphQL用户类型模型中定义嵌套对象字段？

嘿，我来帮你搞定这个问题！根据你的需求，有两个实用方案可选，取决于你想怎么存储Facebook返回的图片数据：

方案1：只存储图片URL（推荐） #

大多数场景下我们只需要图片的实际访问链接，所以直接把facebookPicture定义为String类型就够用了，简洁又实用：

type User @model {
  # Required system field:
  id: ID! @isUnique # read-only (managed by Graphcool)
  # Optional system fields (remove if not needed):
  createdAt: DateTime! # read-only (managed by Graphcool)
  updatedAt: DateTime! # read-only (managed by Graphcool)
  facebookUserId: String @isUnique
  facebookEmail: String
  facebookName: String
  facebookPicture: String # 定义为字符串类型，存储图片URL
  posts: [Post!]! @relation(name: "UserPosts")
}

对应的JavaScript函数里，你需要调整取值路径，拿到嵌套在picture.data里的url，建议加个空值判断避免报错：

function createGraphcoolUser(facebookUser) {
  const pictureUrl = facebookUser.picture?.data?.url || '';
  
  return api.request(`
    mutation {
      createUser(
        facebookUserId: \"${facebookUser.id}\"
        facebookEmail: \"${facebookUser.email}\"
        facebookName: \"${facebookUser.name}\"
        facebookPicture: \"${pictureUrl}\"
      ) {
        id
      }
    }`)
  .then((userMutationResult) => {
    return userMutationResult.createUser.id
  })
}

方案2：存储完整的嵌套结构 #

如果你需要保留Facebook返回的完整图片对象结构，可以自定义嵌套类型来匹配这个结构：

首先定义两个辅助类型：

type FacebookPictureData {
  url: String!
}

type FacebookPicture {
  data: FacebookPictureData!
}

然后修改User模型，把facebookPicture字段指定为自定义的FacebookPicture类型：

type User @model {
  # ... 其他原有字段保持不变
  facebookPicture: FacebookPicture # 使用自定义嵌套类型
  posts: [Post!]! @relation(name: "UserPosts")
}

对应的函数里，要按照GraphQL的嵌套格式传入参数，同样建议做空值处理：

function createGraphcoolUser(facebookUser) {
  const pictureData = facebookUser.picture?.data || { url: '' };
  
  return api.request(`
    mutation {
      createUser(
        facebookUserId: \"${facebookUser.id}\"
        facebookEmail: \"${facebookUser.email}\"
        facebookName: \"${facebookUser.name}\"
        facebookPicture: {
          data: {
            url: \"${pictureData.url}\"
          }
        }
      ) {
        id
      }
    }`)
  .then((userMutationResult) => {
    return userMutationResult.createUser.id
  })
}

小提示 #

• 优先选方案1，因为存储URL足够满足绝大多数业务需求，后续查询和使用都更方便
• 空值判断很重要，避免Facebook返回的数据里缺失picture字段导致代码报错

内容的提问来源于stack exchange，提问作者Gab