Development discussions around Shopify APIs
To continue receiving payouts, you need to secure your account by turning on two-step authentication. If two-step authentication is not turned on your payouts will be paused. Learn more
Hi all, I am use apollo graphql package to do graphql query operations. here is the basic code:
// this basic ApolloClient object info
const client = new ApolloClient({
uri:uriNew,
cache:new InMemoryCache(),
request: operation => {
operation.setContext({
headers: {
"X-Shopify-Access-Token": accessToken,
"Content-type" : "application/json",
}
});
},
credentials:"include"
});
// below is the TestQuery.js file.
function TestQuery(){
const QUERY_GQL = gql`
query helloworld($id: ID!){
product(id: $id) {
title
handle
descriptionHtml
id
}
}
`;
const {loading, error, data} = useQuery(QUERY_GQL,{variables:{ id: "gid://shopify/Product/xxxxxxId" }});
if(loading) console.log("Loading");
else if(error) {
console.log(error);
}
return (
<div>
<p>{data.product.title}</p>
</div>
);
}
export default TestQuery;
//the TestQuery used in another file, i confirm that the root element contains ApolloProvider.
this is the screenshot of the error :
package used : apollo/Client.
By the way : project created by the shopify-cli use "react-apollo, graphql-tag, app-bridge-react" , it uses "useAppBridge()" call before new a apolloClient and in this way :
const client = new ApolloClient({
//Return an authenticated fetch function
fetch: userLoggedInFetch(app),
fetchOptions: {
// 指的是web api request中 是否一直发送凭证
credentials: "include",
},
});
official react app demo use Query tag from react-apollo to do graphql query call like this :
it works fine. so i am confused. Anyone could help? many thanks.
Solved! Go to the solution
This is an accepted solution.
I solved it by use this code, but i don't where occurs CORS error....
const app = useAppBridge();
const client = new ApolloClient({
cache: new InMemoryCache(),
link: createHttpLink({
credentials: "include",
headers: {
"Content-Type": "application/graphql",
},
fetch: authenticatedFetch(app),
}),
});
ApolloClient , i use the apollo/client package instead of deprecated react-apollo .
This is an accepted solution.
I solved it by use this code, but i don't where occurs CORS error....
const app = useAppBridge();
const client = new ApolloClient({
cache: new InMemoryCache(),
link: createHttpLink({
credentials: "include",
headers: {
"Content-Type": "application/graphql",
},
fetch: authenticatedFetch(app),
}),
});
ApolloClient , i use the apollo/client package instead of deprecated react-apollo .
User | RANK |
---|---|
6 | |
5 | |
5 | |
5 | |
4 |
Learn these 5 things I had to learn the hard way with starting and running my own business
By Kitana Jan 27, 2023Would you love to unleash the unbridled power of the Google Shopping Channel into your sho...
By Gabe Jan 6, 2023How can you turn a hobby into a career? That’s what Emmanuel did while working as a wa...
By Skye Dec 30, 2022