How to create 404 page for SSR single blog post?

Developing with Prismic
14

Hello @niki.brown

Prismic client API throws an error if no documents were returned. We need to handle it by exception handling. I am using try…catch statements that handle if any exception is thrown:

import { client } from "../../prismic-configuration"
import FourOhFour from "../../components/FourOhFour"
import SinglePost from "../../components/SinglePost"

export async function getServerSideProps({ query, res }) {
  let post = {}
  var errorCode = ""
  try {
    post = await client.getByUID("blog_post", query.uid, {
     fetchLinks: [
       "webinar.title",
	"webinar.uid",
	"webinar.thumbnail",
	"ebook.title",
	 "ebook.uid",
	 "ebook.thumbnail",
	 "story.title",
	 "story.uid",
	 "story.thumbnail",
     ],
  })
} catch (e) {
    if (!e.response) errorCode = "404"
 }

	// const errorCode = res.ok ? false : res.statusCode

  return { props: { post, errorCode } }
}

const Post = ({ post, errorCode }) => {
  if (errorCode) {
    return <FourOhFour />
  }

  return <SinglePost post={post} />
}

export default Post

Give this a try and let me know if you have any questions.

Thanks,
Priyanka