'How can I configure Apollo to always ignore its cache and fetch directly from the GraphQL server?
I am developing a React UI that makes use of a GraphQL API I have written (using Hot Chocolate and ASP.NET 6.0). I have just started coding the UI project and am new to both React and Apollo. I don't wish to use Apollo's built-in caching, but rather always directly query the API, and I gather the way to achieve this is by using a fetch policy. No matter what I try, however, I can't seem to bypass the cache.
At the moment I have just some basic code, running the same query three times in index.js
and logging the results to the console, along with a mostly empty component that uses the useQuery
hook to execute the same query again and JSON.stringify
the result into the page. I get four copies of the query result as expected (three in the log, one on the page) but both the browser developer tools network tab and the log from my API confirm that only one request is ever sent (while varying the query in one of the client calls results in two network round-trips as expected).
I have tried:
client.query({
query: gql`
query{ ... }
`,
fetchPolicy: 'no-cache'
}).then(result => console.log(result));
and
const defaultOptions = {
watchQuery: {
fetchPolicy: 'no-cache',
errorPolicy: 'ignore',
},
query: {
fetchPolicy: 'no-cache',
errorPolicy: 'all',
},
mutate: {
errorPolicy: 'all'
}
}
const client = new ApolloClient({ uri: "...", cache: new InMemoryCache(),
credentials: 'include', defaultOptions,
});
and
const qry = gql`
query{ ... }
`;
const { loading, error, data } = useQuery(qry, { fetchPolicy: "no-cache" });
for configuring the hook, along with 'network-only' instead of 'no-cache' in all of the above. None of these seems to have any effect.
What am I doing wrong? I am using @apollo/[email protected] which appears to be the latest version, and [email protected].
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|