Preview problem - Internal Server Error 500

[andrzej (Andrzej Michalski)]

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 ;-) )

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 {
name
creations
pronounced
title_holder {
...title_holderFields
lifeevents {
...lifeeventsFields
}
}
predecessors {
...predecessorsFields
}
family_members {
...family_membersFields
}
}
}`
  const fullFamily = await Client().getByUID('family', params.uid,
      { 'graphQuery': mySuperGraphQuery, lang: 'en-gb', pageSize : 1, page : 1 }
    );

  return {
    props: {
      preview,
      family,
      fullFamily
    }
  }
}

Any help, would be really appreciated!

[Phil (Phil Snow)]

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.

Previews with Next.js

[andrzej (Andrzej Michalski)]

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...

[Phil (Phil Snow)]

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.

[andrzej (Andrzej Michalski)]

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.

[Phil (Phil Snow)]

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

[andreas.kratzel (Andi Kratzel)]

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?

Thanks!

[andrzej (Andrzej Michalski)]

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

[andreas.kratzel (Andi Kratzel)]

Do you mean "Master + Releases"?

Currently my token is master only.

[andrzej (Andrzej Michalski)]

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

[samlittlefair]

@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.

Best,
Sam