How I set up Sanity draft mode preview with Next.js App Router and Vercel Edge Config
The article discusses setting up Sanity draft mode preview using Next.js App Router and Vercel Edge Config. It highlights the challenges faced, such as cookie restrictions and security risks associated with hard-coded secrets. The author provides a detailed guide on implementing a secure and efficient preview setup.
- ▪Sanity draft mode preview allows for authenticated queries to access unpublished content directly from the API.
- ▪Vercel Edge Config enables the secure storage of preview secrets, allowing for updates without redeployment.
- ▪The setup involves creating a route handler that validates secrets and slugs before enabling draft mode.
Opening excerpt (first ~120 words) tap to expand
try { if(localStorage) { let currentUser = localStorage.getItem('current_user'); if (currentUser) { currentUser = JSON.parse(currentUser); if (currentUser.id === 2638501) { document.getElementById('article-show-container').classList.add('current-user-is-article-author'); } } } } catch (e) { console.error(e); } Nayan Kyada Posted on May 27 • Originally published at nayankyada.com How I set up Sanity draft mode preview with Next.js App Router and Vercel Edge Config #sanity #nextjs #vercel #draftmode Sanity draft mode preview on Vercel edge sounds simple until you hit the edge runtime's cookie restrictions, a leaked preview secret in a Git repo, or a client asking why their unpublished page just appeared in Google Search Console.
…
Excerpt limited to ~120 words for fair-use compliance. The full article is at DEV.to (Top).