[CLIENT] Getting Parse error: "Network error: Unexpected token < in JSON at position 0"

1

I’m working on a new starter app and have the following component in a react app that works perfectly using AppProvider.

import React from 'react';
import { compose } from 'recompose';
import { graphql } from 'react-apollo';

const USER_QUERY = gql`
  query {
    user {
      id
      email
      lastName
      firstName
    }
  }
`;

let Profile = ({ ...restArgs }) => (
  <>
    <h1>Welcome Profile!</h1>
    {restArgs.user.loading ? (
      <span>Loading...</span>
    ) : (
      <div>
        {console.log(restArgs)}
        <h1>{restArgs.user.email}</h1>
      </div>
    )}
  </>
);

Profile = compose(graphql(USER_QUERY, { name: 'user' }))(Profile);

export { Profile };

Apollo is constantly throwing an error that:

"Error: Network error: Unexpected token < in JSON at position 0
    at new ApolloError (http://localhost:3000/static/js/0.chunk.js:67457:24)
    at ObservableQuery.getCurrentResult (http://localhost:3000/static/js/0.chunk.js:67581:18)
    at QueryData.getQueryResult (http://localhost:3000/static/js/0.chunk.js:58998:56)
    at QueryData._this.getExecuteResult (http://localhost:3000/static/js/0.chunk.js:58745:26)
    at QueryData.execute (http://localhost:3000/static/js/0.chunk.js:58796:58)
    at http://localhost:3000/static/js/0.chunk.js:59153:55
    at useDeepMemo (http://localhost:3000/static/js/0.chunk.js:59106:14)
    at useBaseQuery (http://localhost:3000/static/js/0.chunk.js:59152:16)
    at useQuery (http://localhost:3000/static/js/0.chunk.js:59170:10)
    at Query (http://localhost:3000/static/js/0.chunk.js:56256:84)
    at renderWithHooks (http://localhost:3000/static/js/0.chunk.js:161240:22)
    at updateFunctionComponent (http://localhost:3000/static/js/0.chunk.js:162990:24)
    at beginWork (http://localhost:3000/static/js/0.chunk.js:164045:20)
    at performUnitOfWork (http://localhost:3000/static/js/0.chunk.js:168075:16)
    at workLoop (http://localhost:3000/static/js/0.chunk.js:168116:28)
    at renderRoot (http://localhost:3000/static/js/0.chunk.js:168196:11)
    at performWorkOnRoot (http://localhost:3000/static/js/0.chunk.js:169153:11)
    at performWork (http://localhost:3000/static/js/0.chunk.js:169063:11)
    at performSyncWork (http://localhost:3000/static/js/0.chunk.js:169037:7)
    at requestWork (http://localhost:3000/static/js/0.chunk.js:168892:9)
    at scheduleWork (http://localhost:3000/static/js/0.chunk.js:168705:9)
    at dispatchAction (http://localhost:3000/static/js/0.chunk.js:161909:9)
    at Object.error (http://localhost:3000/static/js/0.chunk.js:58968:17)
    at notifySubscription (http://localhost:3000/static/js/0.chunk.js:195924:18)
    at onNotify (http://localhost:3000/static/js/0.chunk.js:195963:3)
    at SubscriptionObserver.error (http://localhost:3000/static/js/0.chunk.js:196020:7)
    at http://localhost:3000/static/js/0.chunk.js:67928:23
    at Array.forEach (<anonymous>)
    at iterateObserversSafely (http://localhost:3000/static/js/0.chunk.js:67927:23)
    at Object.onError [as error] (http://localhost:3000/static/js/0.chunk.js:67869:7)
    at invoke (http://localhost:3000/static/js/0.chunk.js:68919:27)
    at http://localhost:3000/static/js/0.chunk.js:68952:16
    at http://localhost:3000/static/js/0.chunk.js:69373:13
    at Set.forEach (<anonymous>)
    at http://localhost:3000/static/js/0.chunk.js:69371:24
    at Map.forEach (<anonymous>)
    at QueryManager.broadcastQueries (http://localhost:3000/static/js/0.chunk.js:69369:18)
    at http://localhost:3000/static/js/0.chunk.js:68847:27"

Having trouble figuring out how to solve this. Any pointers?

2

“Unexpected token <“ is usually just getting HTML back instead of JSON. Is the endpoint correct? Is the route fallback finding another file? Is there some proxying happening, doing something weird or throwing an error? Does the network tab show what’s being returned?

1 Like
3

Oy vey, you were right mike. The ENV variable I set for workspace ID was mis-named and returning undefined :man_facepalming: