How can I get data from wordpress to react native app using graphql

Support
1

I just try to use data from wordpress site to mobile app with graphql from wordpress side I reach to the uri of site “http://10.0.2.2:10005/graphql” after install graphql plugin from app side I did these steps in app.js

import ApolloClient from 'apollo-boost';
import { ApolloProvider } from 'react-apollo';

const client = new ApolloClient({
  uri:'http://10.0.2.2:10005/graphql/'
})

export default function App() {
  return (
    <ApolloProvider client={client}>
     <Drawer/>
   </ApolloProvider>
  );
}

in another screen

import { Query } from 'react-apollo';
import gql from 'graphql-tag';

export default function IndiviOffers() {
return(
    <Query query={gql`
    {
         posts {
    edges {
      node {
        id
      }
    }
  }        
    }
    `}>
        {({ loading, error, data })=>{
            console.log(data)

            
    return (
        <View >
            <Text>Your Offers</Text>
        </View>
    )
        }}
    </Query>
)
}

got that error Network error: JSON Parse error: Unrecognized token ‘<’

2

I usually see that kind of error when an endpoint is responding with non-json data. This could be due to incorrect Content-Type headers, or something like a server error resulting in the endpoint sending HTML instead of JSON.

If you try and access that endpoint using a different tool, what’s the response? For example, using one of the curl examples from the WPGraphQL plugin, you can open a terminal and run a command which looks like this on my machine:

Image 2021-09-29 at 8.59.37 AM
Image 2021-09-29 at 8.59.37 AM839×497 89.3 KB

You’ll need to update with the correct url, but having those headers along with the response should give you a better idea of what the site is responding with.

3

thanks for your reply but just follow steps mentioned in this video
so I don’t have enough information for this update

4

That video is pretty long. Can you summarize what you’ve tried along with ideas you have for what might be breaking? If the video covers some items that are specific to React Native, you might need to create a comment on that Youtube video to see if the video author has any ideas.