在 GraphQL API 响应报错:Fields “default” conflict because they return conflicting types Float! and Boolean!. Use different aliases on the fields to fetch both if this was intentional.

1、在 GraphQL API 响应报错:Fields “default” conflict because they return conflicting types Float! and Boolean!. Use different aliases on the fields to fetch both if this was intentional.

{
  "errors": [
    {
      "message": "Fields \"default\" conflict because they return conflicting types Float! and Boolean!. Use different aliases on the fields to fetch both if this was intentional.",
      "extensions": {
        "category": "graphql"
      },
      "locations": [
        {
          "line": 134,
          "column": 3
        },
        {
          "line": 145,
          "column": 3
        }
      ]
    },
    {
      "message": "Fields \"value\" conflict because they return conflicting types Float! and Boolean!. Use different aliases on the fields to fetch both if this was intentional.",
      "extensions": {
        "category": "graphql"
      },
      "locations": [
        {
          "line": 139,
          "column": 3
        },
        {
          "line": 146,
          "column": 3
        }
      ]
    }
  ]
}

2、查看查询请求,发现有相应提示:Fields “default” conflict because they return conflicting types “Float!” and “Boolean!”. Use different aliases on the fields to fetch both if this was intentional.。如图1

图1

query OnlineStoreTheme($themeId: ID!) {
  onlineStoreTheme(themeId: $themeId) {
    themeSettingsCategories {
      ...ThemeSettingsCategory
      __typename
    }
    __typename
  }
}

fragment ThemePreset on ThemePreset {
  id
  settings {
    ...ThemeStyleSetting
  }
  sections {
    id
    sectionId
    disabled
    schema {
      blockSchemas {
        id
        limit
        name
        settings {
          id
          info
          label
          settingId
          type
        }
        type
      }
    }
  }
}

fragment ThemeStyleSetting on ThemeStyleSetting {
  id
  settingId
  value
  type
}

fragment ThemeSettingsCategory on ThemeSettingsCategory {
  id
  title
  settings {
    ...ThemeSetting
    __typename
  }
  __typename
}

fragment ThemeSetting on ThemeSetting {
  ... on ThemeSettingRange {
    ...ThemeSettingRange
    __typename
  }
  ... on ThemeSettingCheckbox {
    ...ThemeSettingCheckbox
    __typename
  }
  __typename
}

fragment ThemeSettingCommon on ThemeSetting {
  id
  info
  label
  settingId
  type
  __typename
}

fragment ThemeSettingRange on ThemeSettingRange {
  ...ThemeSettingCommon
  default
  min
  max
  step
  unit
  value
  __typename
}

fragment ThemeSettingCheckbox on ThemeSettingCheckbox {
  ...ThemeSettingCommon
  default
  value
  __typename
}

3、原因应该在于此接口类型的实现中,字段类型不一样,查询时使用了内联片段。在 ThemeSettingRange 中为 Float!。在 ThemeSettingCheckbox 中为 Boolean!。如果您在同一选择集中多次请求具有相同名称(或别名)的字段,则该字段必须返回相同的类型。如图2、图3

图2

 

图3

type ThemeSettingRange implements ThemeSetting
{

    default: Float!

    value: Float!
}

type ThemeSettingCheckbox implements ThemeSetting
{

    default: Boolean!


    value: Boolean!
}

4、参考:https://github.com/graphql/graphql-js/issues/1361 ,使用别名可以解决此问题。但是使用别名,会增加客户端的解析难度。如图4

图4

fragment ThemeSettingRange on ThemeSettingRange {
  ...ThemeSettingCommon
  rangeDefault: default
  min
  max
  step
  unit
  rangeValue: value
  __typename
}
{
  "id": "96b1c8b9-5b18-4760-9e26-50ab009ac011/settings/radius__image",
  "info": null,
  "label": "图片圆角度数",
  "settingId": "radius__image",
  "type": "RANGE",
  "__typename": "ThemeSettingRange",
  "rangeDefault": 0,
  "min": 0,
  "max": 24,
  "step": 1,
  "unit": null,
  "rangeValue": 0
}

 

 

永夜