Sanity/Next.js Caching Issue With Recent Deployment

This was cross-posted in the sanity slack but it seems to be a Vercel deployment caching issue which is why I am posting it here in the vercel help community:

I’m having a very interesting issue with the sanity preview url secret plugin. My code is setup with 2 repos, one for the sanity studio and the other repo is for the frontend/previewing/etc. (nextjs with react).
In my development dataset, i am able to preview my pages in draft mode using the preview/visual editing features. This is normally run with npm run dev on both repos. I have a contributor token that I store in an environment variable as the SANITY_API_READ_TOKEN. This is also stored in my vercel environment variables.

However, in production, the code is deployed using vercel and I have all the necessary environment variables working, except i’m getting an invalid secret only in production. I feel like this is some sort of environment variable issue, or maybe caching? I’ve tried changing my token between all permission types, re-deploying on vercel for each different token type that I try, but I’m still getting an invalid secret prompt. I think I’m missing something fundamental here but am wondering if anyone has run into this issue or knows what could be going wrong? My vercel uses node v 20 and my node modules are installed according to that version.
Also, I’ve tried simulating production build on my local with the production dataset and still using any type of token permission and also see the issue in this environment as well. So its specifically related to when I simulate production.

When I re-deploy with an empty commit to re-trigger a new build (instead of hitting redeployment) the preview works in production studio for about 10 minutes, and then reverts back to invalid secret again.

Production preview mode is giving me an invalid secret error, despite having correct environment variables set up that work fine in development but not in production.
When I re-deploy my code, it works successfully for about 5-10 minutes, then breaks again.

I am using the @sanity/preview-url-secret plugin
npm run dev on my local with development, preview works fine
npm run build && npm run start builds and deploys successfully in mock-production view, but preview fails with the error. I can see published pages just fine.

Vercel uses my environment variables which have not changed since past deployments. My builds are successful but there seems to be a caching issue. I’ve cleared my cache in vercel to no avail.

Sanity (version 3.5) Project using Next.js (version 13) and React version 18, Node modules use node v 20, Vercel deployed with node version 20.

Hi @halanizi, welcome to the Vercel Community!

Sorry that you’re facing this issue. Can you share some code snippets as to how you are using the environment variable? Also, any Sanity, Sanity Studio, or Next.js config files.

Can you also share the docs you followed for the set up?

1 Like