Preview problem - Internal Server Error 500

Could I get some assistance as I'm driving myself crazy with this one.

When I click on the 'Preview' icon in Prismic I am taken to the server and I see various url params, but just get an "Internal Server Error" 500 response.

I've followed the docs, as well as the troubleshooting guide, but am still very much stuck. Hoping my use case might help others who end up in a similar corner (whatever corner that may be :wink: )

So, first off I've created the pages/api/preview js file and ensured that it is importing the correct environment values in Client for the req. I've also checked that the linkResolver looks in order. Seems simple enough.

I've checked the browser has got cookies set (I see x2 cookies).
I've also set the preview site address in the Prismic settings UI to match up with my local dev environment (http://localhost:3000) - I've tried my public address too - both exhibit the same error behaviour.

Which leaves me to think that the issue lies in my getStaticProps in my dynamic [uid].js page - does this look ok?

export async function getStaticProps({ params, preview = null, previewData = {} }) {
  const { ref } = previewData
  const family = await Client().getByUID("family", params.uid, ref ? { ref } : null) || {}
  const mySuperGraphQuery = `{
family {
title_holder {
lifeevents {
predecessors {
family_members {
  const fullFamily = await Client().getByUID('family', params.uid,
      { 'graphQuery': mySuperGraphQuery, lang: 'en-gb', pageSize : 1, page : 1 }

  return {
    props: {

Any help, would be really appreciated!

Hey Andrzej,

I'm guessing you had some cookies that didn't get cleared and are not out of date. If you clear these and start again it should work. The cookies you'll want to clear are:

  • io.prismic.preview
  • _next_preview_data
  • _prerender_bypass

Then to make sure this doesn't happen again in the future, make sure you add a exit preview button to clear the next.js cookie.

Thanks Phil - I figured it out, and it was the silliest thing: I'd forgotten to set the environment vars in Vercel. Doh!

Might be a good checklist item for your documentation for those that are as forgetful as me...

I'm glad you figured this out. That's a really good catch. I'll definitely update the docs.

Would you mind sharing your fix here for anyone who comes across this issue on the forum?


Thanks - in more detail:

When developing locally I was holding the prismic token etc within the .env file, which for security reasons is not synced to my git repo. When Vercel performs its build it gets the code from the repo so doesn't have the environment variables. Hence the Error 500.

The fix was to go to Vercel and go to Project -> Settings -> Environment Variables and set them there.

1 Like

Thanks so much for sharing this :slight_smile: This will really help others.

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.

Hey, so I am facing a similar issue. I use next.js on my application and I am receiving 500 Internal Server Errors on my unpublished documents. It works fine for all other documents.

I saw that Troubleshooting: Previews provides help here, but adding the toolbar js on my 404 page did not help unfortunately. The rest is pretty much set up as it is recommended here Previews with Next.js - Prismic

Is there a proper way to preview unpublished docs?


Hi Andreas - Are you using a token that provides access to "Master + Versions" - sounds like you might need that in place...?

Do you mean "Master + Releases"?

Currently my token is master only.

Yes, sorry, that's what I was thinking. I don't know for sure that this will solve the problem, but just a thought!

@andreas.kratzel If @andrzej's suggestion doesn't work, you could send me a ZIP file or git repo containing your project, and I could try to find the source of the problem. Feel free to send it in a DM.


This thread has been closed due to inactivity. Flag to reopen.