在 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
}