title: graphQL: SyntaxError: Unexpected token " in JSON at position 0
body: <p>I started learning some GraphQL and so far in the Playground everything works great. no issues with it.</p>
  <p>I do have some issues while querying Apollo Server. I am not entirely sure what's causing the issue but I suppose I am not sending the correct payload to the server.</p>
  <p>app.js</p>
  <pre><code>import { ApolloClient, gql } from '@apollo/client';
  
  const client = new ApolloClient({
    uri: 'http://localhost:4000',
  });
  
  client.query({
    query: gql`
      query TestQuery {
        hello {
          title
        }
      }
    `,
  });
  </code></pre>
  <p>Server:</p>
  <pre><code>const { ApolloServer, gql } = require('apollo-server');
  
  const typeDefs = gql`
    type Obj {
      title: String
    }
  
    type Query {
      hello: Obj
    }
  `;
  
  const resolvers = {
    Query: {
      hello: () =&gt; ({ title: 'hello' }),
    }
  }
  
  const server = new ApolloServer({ typeDefs, resolvers });
  
  server.listen().then(() =&gt; {
    console.log('Server is running! Listening on port 4000');
  });
  </code></pre>
  <p>Playground:</p>
  <p><a href="https://i.stack.imgur.com/uaEGU.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uaEGU.jpg" alt="playground" /></a></p>
  <p>Client:</p>
  <p><a href="https://i.stack.imgur.com/J26pW.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/J26pW.jpg" alt="client" /></a></p>
  <p>I am also sharing the body of the request (which seems to be a string)</p>
  <pre><code>{&quot;operationName&quot;:&quot;TestQuery&quot;,&quot;variables&quot;:{},&quot;query&quot;:&quot;query TestQuery {\n hello {\n title\n __typename\n }\n}\n&quot;}
  No properties
  </code></pre>
  <p>I think the request body is a string but I am not sure what could cause the issue. Any help?</p>
  <p>Thanks</p>