GraphQLError: Syntax Error: Expected $, found [

Question

I am trying to query a graphql server which is here

http://sapienscube.pythonanywhere.com/intrusion-detection-system

with this query using Apollo in Reactjs:

const PREDICT_ATTACK_TYPE = gql`
  query Query($packets: List[List[String]) {
    predict(packets: $packets)
  }
`;
// features is an array of arrays of strings: List[List[String]] like this: [[0, tcp, http, ..., ]]
<Query query={PREDICT_ATTACK_TYPE} variables={{ features }}>
        {({ loading, error, data }) => {
          if (loading) return <div>loading..</div>;
          if (error) return <div>Error:</div>;
          console.log(data);
          return <div>{data.predict}</div>;
        }}

But i'm getting the error

GraphQLError: Syntax Error: Expected $, found [

   5 | 
   6 | import { getFeaturesArray } from "./Utils";
   7 | 
>  8 | const PREDICT_ATTACK_TYPE = gql`
   9 |   query Query($packets: List[List[String]]) {
  10 |     predict(packets: $packets)
  11 |   }

Daniel Rearden Daniel Rearden · Accepted Answer · 2019-05-22T17:38:58

While List is technically a type in GraphQL, it can't be referenced inside a GraphQL document by name. When specifying a List of a particular type, just wrap the type in square brackets ([ ]).

query Query($packets: [[String]]) {
  predict(packets: $packets)
}

Here [[String]] indicates a List of a List of Strings.

You're seeing the above error because the parser is registering the type List as the type for $packets and moving on to the next valid character, which should be $ to indicate the start of the next variable definition.

GraphQLError: Syntax Error: Expected $, found [

1 Answers