Data Cache POST method caching
Answered
Mini Lop posted this in #help-forum
Mini LopOP
I'm trying to figure out if the Next.js App Router data cache can be configured to cache POST requests (specifically GraphQL queries). I understand that by default POST requests are opted out of caching, but I'm wondering if explicitly adding { next: { revalidate: <time> } } or { next: { tags: <revalidation tags> }} can override this default behavior and enable caching for these POST requests. Has anyone successfully cached POST GraphQL queries with these options? I can't seem to find this specific information in the docs. Thank you!
Answered by B33fb0n3
when using fetch you can try to set the cache setting there:
If that still doesn't work, you can only cache it using
So try the
const posts = await fetch('https://api.vercel.app/blog', {
cache: 'force-cache',
}).then((res) => res.json())
// just an example
If that still doesn't work, you can only cache it using
unstable_cache
. It's way more stable then it sounds like and in future version, you using the directive 'use cache'
. However, the directive 'use cache'
is waaaay more unstable compared to unstable_cache
.So try the
fetch
thing first and if it's not working, use the unstable cache5 Replies
@Mini Lop I'm trying to figure out if the Next.js App Router data cache can be configured to cache POST requests (specifically GraphQL queries). I understand that by default POST requests are opted out of caching, but I'm wondering if explicitly adding { next: { revalidate: <time> } } or { next: { tags: <revalidation tags> }} can override this default behavior and enable caching for these POST requests. Has anyone successfully cached POST GraphQL queries with these options? I can't seem to find this specific information in the docs. Thank you!
why do you want to cache a POST request? When receiving (and caching) data, you normally use GET
Mini LopOP
yeah but graphql requests are typically sent via POST so it'd be useful to be able to cache them
@Mini Lop yeah but graphql requests are typically sent via POST so it'd be useful to be able to cache them
when using fetch you can try to set the cache setting there:
If that still doesn't work, you can only cache it using
So try the
const posts = await fetch('https://api.vercel.app/blog', {
cache: 'force-cache',
}).then((res) => res.json())
// just an example
If that still doesn't work, you can only cache it using
unstable_cache
. It's way more stable then it sounds like and in future version, you using the directive 'use cache'
. However, the directive 'use cache'
is waaaay more unstable compared to unstable_cache
.So try the
fetch
thing first and if it's not working, use the unstable cacheAnswer
Mini LopOP
thanks 🙏 , yeah, ended up using unstable_cache
happy to help