Поле Graphql не существует по типу

Question

Пролистав документы Graphql, я начал реализовывать его в проекте игрушечных rails / ReactionJS.Проект позволяет пользователю войти через devise, а затем получить доступ к маршруту фиктивного / артиста, который отображает список артистов.Кажется, все работает нормально, пока я не попробую использовать данные API с GraphQL из приложения реакции, чтобы найти художников и отобразить их.

На стороне сервера у меня есть graphql_controller.rb , такой как:

class GraphqlController < ApiController
  rescue_from Errors::Unauthorized do |exception|
    render json: {errors: ['Unauthorized.']}, status: :unauthorized
  end

  def index
    result = Schema.execute params[:query], variables: params[:variables], context: context
    render json: result, status: result['errors'] ? 422 : 200
  end

private

  def context
    token, options = ActionController::HttpAuthentication::Token.token_and_options request
    {
      ip_address: request.remote_ip
    }
  end
end

Затем, следуя логике моей модели, я настроил graphql под graph/ со следующими файлами:

график / запросы / artist_query.rb

ArtistQuery = GraphQL::ObjectType.define do
  name 'ArtistQuery'
  description 'The query root for this schema'

  field :artists, types[Types::ArtistType] do
    resolve(->(_, _, _) {
      Artist.all
    })
  end
end

types / artist_type.rb

Types::ArtistType = GraphQL::ObjectType.define do
  name 'Artist'
  description 'A single artist.'

  field :id, !types.ID
  field :name, types.String
  field :description, types.String
end

schema.rb

Schema = GraphQL::Schema.define do
  query ArtistQuery
end

На стороне клиента, для сохранения порядка, я использую 3 файла для рендеринга этого списка исполнителей:

Сначала ArtistSchema.js

import { gql } from 'react-apollo';

const artistListQuery = gql`
    {
        query {
            artists {
                id
                name
                description     
            }
        }
    }
`;

export default artistListQuery;

Затем Artist.js

import React, { Component } from 'react';

class Artist extends Component {
    render() {
        return (
            <tr>
                <td>{this.props.index + 1}</td>
                <td>{this.props.data.name}</td>
                <td>{this.props.data.description} min</td>
            </tr>
        );
    }
}

export default Artist;

И, наконец, объединяем эти два вмакет большего размера: Artists.jsx :

import React, { Component } from 'react';
import {graphql} from 'react-apollo';
import Artist from './Artist';
import artistListQuery from './ArtistSchema';

class Artists extends Component {
    render() {
        if(this.props.data.loading) {
            return (<p>Loading</p>)
        } else {

            console.log(this.props.data)
            const ArtistsItems = this.props.data.artists.map((data,i) => {
                return (<Artist key={i} index={i} data={data}></Artist>);
            });
            return (
                <div>
                    <h1>Artists</h1>
                    <table className="table table-striped table">
                        <thead>
                        <tr>
                            <th>#</th>
                            <th>Name</th>
                            <th>Description</th>
                        </tr>
                        </thead>
                        <tbody>
                        { ArtistsItems }
                        </tbody>
                    </table>
                </div>
            );
        }

    }
}

export default graphql(artistListQuery)(Artists);

Что происходит при выполнении этого кода:

На стороне сервера (извините за неформатированный вывод, но этов консоли отображается так:

Processing by GraphqlController#index as */*
18:49:46 api.1  |   Parameters: {"query"=>"{\n  query {\n    artists {\n      id\n      name\n      description\n      __typename\n    }\n    __typename\n  }\n}\n", "operationName"=>nil, "graphql"=>{"query"=>"{\n  query {\n    artists {\n      id\n      name\n      description\n      __typename\n    }\n    __typename\n  }\n}\n", "operationName"=>nil}}

За этим следует ошибка:

Completed 422 Unprocessable Entity in 36ms (Views: 0.2ms | ActiveRecord: 0.0ms)

На стороне клиента, если я отслеживаю Сеть> Ответ для graphql, я (конечно) получаюкод ошибки 422d следующее сообщение об ошибке:

{"errors":[{"message":"Field 'query' doesn't exist on type 'ArtistQuery'","locations":[{"line":2,"column":3}],"fields":["query","query"]}]}

Я предполагаю, что мой запрос выполнен неправильно.Я пробовал различные форматы запросов (из примеров документов или таблиц), но не могу не найти правильный способ вернуть данные об исполнителе.

Что я делаю не так?

Answer 1

Хорошо, проблема не в самом коде.Я изменил запрос на тот, который вы посоветовали, и обновил имя исполнителя на что-то другое как на стороне клиента, так и на стороне сервера.Похоже, что apollo-rails кэширует предыдущие вызовы API, даже если они потерпели неудачу, поэтому я всегда получал одну и ту же ошибку.Я все еще должен выяснить, как очистить этот кеш.Спасибо за ваше время.

Answer 2

Отправленный вами GQL-запрос некорректен, он запрашивает поле query корневого объекта Query.Используйте это вместо:

const artistListQuery = gql`
    query UseTheNameYouWantHere {
        artists {
            id
            name
            description     
        }
    }
`;

Кстати, вы можете добавить graphiql драгоценный камень (https://github.com/rmosolgo/graphiql-rails), чтобы иметь игровую площадку с вашим GraphQL API.