App reviews, troubleshooting, and recommendations
I am trying to use the apollo client on the frontend and make graphql queries from the frontend.
On app.jsx I setup like this:
import { BrowserRouter } from 'react-router-dom' import Routes from './Routes' import { ApolloClient, HttpLink, InMemoryCache } from '@apollo/client' import { ApolloProvider } from '@shopify/react-graphql' import { Toaster } from 'react-hot-toast' import { AppBridgeProvider, QueryProvider } from './components/providers' import { useAuthenticatedFetch } from './hooks' export default function App() { // Any .tsx or .jsx files in /pages will become a route // See documentation for <Routes /> for more info const pages = import.meta.globEager('./pages/**/!(*.test.[jt]sx)*.([jt]sx)') return ( <BrowserRouter> <AppBridgeProvider> <QueryProvider> <ApolloWrapper> <Routes pages={pages} /> <Toaster /> </ApolloWrapper> </QueryProvider> </AppBridgeProvider> </BrowserRouter> ) } const ApolloWrapper = ({ children }) => { const client = new ApolloClient({ cache: new InMemoryCache(), link: new HttpLink({ uri: '/api/shopify/graphql', credentials: 'include', fetch: useAuthenticatedFetch() }) }) return <ApolloProvider client={client}>{children}</ApolloProvider> }
and on the server index.js I created an endpoint
app.post('/api/shopify/graphql', async (req, res) => { try { const session = res.locals.shopify.session const response = await shopify.api.clients.graphqlProxy({ session: session, rawBody: req.body }) res.status(200).send(response.body) } catch (error) { res.status(500).send(error.message) } })
But sadly It's not working, i am getting error: Cannot convert undefined or null to object
Here is my query example:
import { gql, useQuery } from '@apollo/client' const GET_ORDERS = gql` query GET_ORDERS { orders(first: 10) { nodes { id } } } ` const Orders = () => { const { loading, error, data } = useQuery(GET_ORDERS) return (<></>) }
I also have the same issue. Are you able to find a solution?
Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025Unlock the potential of marketing on your business growth with Shopify Academy's late...
By Shopify Mar 12, 2025