如何在PokeApi GraphQL中仅获取front_default精灵Sprite？

云原生阿岚

2026-8-14

PokeAPI GraphQL 仅获取front_default精灵Sprite的解决方案

我正在使用PokeAPI的GraphQL控制台获取带属性和精灵Sprite的宝可梦数据，属性部分已实现，但无法限制Sprite仅返回front_default类型。

当前查询语句

query samplePokeAPIquery {
   pokemon_v2_pokemon(
      where: {
        pokemon_v2_pokemontypes: {
          type_id: {_in: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]}, 
          pokemon_v2_pokemon: {name: {_like: "%%"}}
        }
      }, 
      order_by: {id: asc}, 
      limit: 10, offset: 0) {
    id
    name
    pokemon_v2_pokemonsprites {
     sprites
    }
  }
}

当前问题

响应返回的sprites字段是包含所有Sprite类型的JSON字符串，冗余数据过多，示例片段如下：

"sprites": "{\"front_default\": \"https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/1.png\", \"front_female\": null, \"front_shiny\": \"https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/shiny/1.png\", ...}"

解决方案

PokeAPI的GraphQL基于Hasura构建，支持通过JSON路径直接提取指定字段。修改查询语句，利用path参数提取front_default：

修改后的查询

query samplePokeAPIquery {
  pokemon_v2_pokemon(
    where: {
      pokemon_v2_pokemontypes: {
        type_id: {_in: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]}, 
        pokemon_v2_pokemon: {name: {_like: "%%"}}
      }
    }, 
    order_by: {id: asc}, 
    limit: 10, offset: 0) {
    id
    name
    pokemon_v2_pokemonsprites {
      front_default: sprites(path: "$.front_default")
    }
  }
}