A space to discuss GraphQL queries, mutations, troubleshooting, throttling, and best practices.
I'm getting the following 400 error response when making a GraphQL request from my Shopify app to the Admin API. The parameters of my GraphQL query are correct (I've tested it via the Shopify GraphiQL explorer), so I'm not sure how to fix it. Has anyone run into this issue before?
{"errors":{"query":"Required parameter missing or invalid"}}
I'm following the default tutorial on creating a Shopify app: https://shopify.dev/tutorials/build-a-shopify-app-with-node-and-react/fetch-data-with-apollo. Someone had the same problem here (https://community.shopify.com/c/Shopify-APIs-SDKs/GraphQL-Admin-interface-Error-400-Required-paramet...) but I don't see a solution.
As the tutorial suggests, I am using a proxy to forward requests to the Admin API from my server
server.use(graphQLProxy({version: ApiVersion.October19}))
My ApolloClient is including my credentials
const client = new ApolloClient({
fetchOptions: {
credentials: 'include'
},
});
And I am sending the following GraphQL query (I've verified the parameters are being set correctly).
import gql from 'graphql-tag';
import { Query } from 'react-apollo';
import { Card } from '@shopify/polaris';
import store from 'store-js';
const GET_PRODUCTS_BY_ID = gql`
query getProducts($ids: [ID!]!) {
nodes(ids: $ids) {
... on Product {
title
handle
descriptionHtml
id
images(first: 1) {
edges {
node {
originalSrc
altText
}
}
}
variants(first: 1) {
edges {
node {
price
id
}
}
}
}
}
}
`;
class ResourceListWithProducts extends React.Component {
render() {
return (
<Query query={GET_PRODUCTS_BY_ID} variables={{ ids: store.get('ids') }}>
{({ data, loading, error }) => {
if (loading) return <div>Loading…</div>;
if (error) {
console.log(error);
return <div>{error.message}</div>;
}
console.log(data);
return (
<Card>
<p>stuff here</p>
</Card>
);
}}
</Query>
);
}
}
export default ResourceListWithProducts;
My Request ID is: 0624cb9c2d00000256d400a000000001
I'm new to being a Shopify developer, so any help would be very welcome. Thanks in advance!
I fixed this issue by appending the content-type to the Apollo Client:
const client = new ApolloClient({
fetchOptions: {
credentials: 'include',
},
headers: {
"Content-Type": "application/json"
}
});
This is very odd because my requests were already sending content-type: application/json. When I look at my 200 requests, they have content-type: "application/json, application/json" -- application/json is being set twice. This is some really odd behavior.
Example successful request ID: 062836862d00009660e3b08000000001