graphiql 上的查询请求

Question

由于我已经感谢您提供的空间，我遇到了以下有关 graphql 的问题，我遵循了公共 api 站点 AniList https://anilist.gitbook.io/anilist-apiv2-docs/overview/graphql/getting-started 的命令，我可以获得很多信息，但我想要什么没搞懂，想抓动漫人物，如果有人能帮帮我，不胜感激，我很外行，代码放在这里

var query = `
{Media (id: 1, type: ANIME) { 
    id
    title {
      romaji
      english
      native
    }
  episodes
  type
  averageScore
  seasonYear
  episodes
  duration
  characters {
    nodes {
      image {
        large
        medium
      }
    }
  }
  coverImage {
    extraLarge
  }
  }
}
`;


var url = 'https://graphql.anilist.co',
    options = {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'Accept': 'application/json',
        },
        body: JSON.stringify({
            query: query,
        })
    };

fetch(url, options).then(handleResponse)
                   .then(handleData)
                   .catch(handleError);

function handleResponse(response) {
    return response.json().then(function (json) {
        return response.ok ? json : Promise.reject(json);
    });
}

function handleData(data) {
    //console.log(data.data.Media.title.userPreferred);
    //document.getElementById("anime").innerHTML = data.data.Media.title.userPreferred;
    
    document.getElementById("title").innerHTML = data.data.Media.title.english;
    document.getElementById("type").innerHTML = data.data.Media.type;
    document.getElementById("episodes").innerHTML = data.data.Media.episodes;
    document.getElementById("averageScore").innerHTML = data.data.Media.averageScore;
    document.getElementById("duration").innerHTML = data.data.Media.duration;
    document.getElementById("episodeList").innerHTML = data.data.Media.episodes;
    document.getElementById("dateanime").innerHTML = data.data.Media.seasonYear;
    document.getElementById("anime_image").setAttribute("src", data.data.Media.coverImage.extraLarge );
    document.getElementById("anime_person").setAttribute("src", data.data.Media.characters.image.large );

     
}

function handleError(error) {
    alert('Error, check console');
    console.error(error);
}

#main, .autofill {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: 15px;
    position: absolute;
    z-index: 1;
    top: -5px;
    font-size: 10px;
    text-shadow: 1px 1px 1px #0000007d;
    line-height: 2.9rem
}

<div class="autofill">
    <strong>name: </strong><span id="title"></span>
    <br />
    <strong>type: </strong> <span id="type"></span><br />
    <strong>N. episodes: </strong> <span id="episodes"></span><br />
    <strong>Score: </strong> <span id="averageScore"></span><br />
    <strong>duration: </strong> <span id="duration"></span> <br />
    <strong>Status: </strong> <span id="episodeList"> </span> <br />
    <strong>In: </strong> <span id="dateanime"></span><br />
    <span>
       <img src="" id="anime_image"> <br />
        <img src="" id="anime_person"> <br />
    </span>
</div>

Answer 1

你可以这样做：

characters = data.data.Media.characters.nodes

这将返回一个数组，您可以对其进行迭代以获取每个字符：

characters[0].image.large