i have an issue where my deployed site and my localhost are showing two totally different things for the same page. im not sure if its a next.js caching thing that i dont understand (im using server components) or theres an error in my code logic
const page = async () => {
const session = await getAuthSession()
const startDate= new Date('2023-08-08T00:00:00')
await connectToDB()
const result = formatDistanceToNowStrict( // this is using datefns
startDate,
{unit: 'day'}
)
const todayItem = await Item.findOne({indexNo:(result.split(' ')[0])})
const todayItemJSON = JSON.parse(JSON.stringify(todayItem))
const alreadySubmittedItemAnswer = await ItemAnswer.findOne({ userWhoSubmittedId: session?.user.id, indexNo: (result.split(' ')[0]) })
return (
<div className="pt-20 mx-auto container h-[100vh] relative">
{... passing in todayItem into client component}
</div>
)
}
export default page
im trying to get a new item every day whenever a user visits this page. in here, im using a server component, defining a const startDate to a specific date, then use the datefns function to return Xdays ago to determine the IndexNo X of an array of items in my backend that i want to retrieve (todayItem). after which, i connect to the db in my backend to retrieve the item using the IndexNo in result. the const alreadySubmittedItemAnswer is me checking the database if the user has already submitted an answer for that particular IndexNo which is const result. in dev mode, the items returned are constantly changing appropriately based on the formatDistanceToNowStrict function (e.g. if i set the units to minutes, every minute i get a new item whenever i visit the page), but the items are stale during production. is it a server caching issue, or is the way i define my code wrong such that the const result will always return the same value?
export const dynamic = 'force-dynamic'
export const fetchCache = 'force-no-store'
this did not work either.