TRPC: How to use different transformers

I followed the documentation on the https://trpc.io/docs/server/data-transformers page, but even after following the 4 steps I'm still getting the error:

tRPC failed on <no-path>: Cannot stringify arbitrary non-POJOs, cause: DevalueError: Cannot stringify arbitrary non-POJOs

Here's the code that probably generated that

export const getServerSideProps: GetServerSideProps = async (
  context: GetServerSidePropsContext,
) => {
  const { search: searchQuery = '' } = context.query
  const ssg = await generateSSGHelper(context)

  if (searchQuery?.length && searchQuery.length >= 1) {
    // `prefetch` does not return the result and never throws - if
    // you need that behavior, use `fetch` instead.
    await ssg.spotify.getSearch.prefetch({
      searchQuery: searchQuery as string,
    })
  }

  return {
    props: {
      // trpcState: ssg.dehydrate()
    },
  }
}

export const getServerSideProps: GetServerSideProps = async (
  context: GetServerSidePropsContext,
) => {
  const { search: searchQuery = '' } = context.query
  const ssg = await generateSSGHelper(context)

  if (searchQuery?.length && searchQuery.length >= 1) {
    // `prefetch` does not return the result and never throws - if
    // you need that behavior, use `fetch` instead.
    await ssg.spotify.getSearch.prefetch({
      searchQuery: searchQuery as string,
    })
  }

  return {
    props: {
      // trpcState: ssg.dehydrate()
    },
  }
}

I didn't return anything in the props because I was already getting an unserializable error that started after authenticating in in the ssgHelper. I would really appreciate any help!

Data Transformers | tRPC

You are able to serialize the response data & input args. The transformers need to be added both to the server and the client.

TTC

Theo's Typesafe Cult•3y ago

ygor perez

TRPC: How to use different transformers

export const getServerSideProps: GetServerSideProps = async (
  context: GetServerSidePropsContext,
) => {
  const { search: searchQuery = '' } = context.query
  const ssg = await generateSSGHelper(context)

  if (searchQuery?.length && searchQuery.length >= 1) {
    // `prefetch` does not return the result and never throws - if
    // you need that behavior, use `fetch` instead.
    await ssg.spotify.getSearch.prefetch({
      searchQuery: searchQuery as string,
    })
  }

  return {
    props: {
      // trpcState: ssg.dehydrate()
    },
  }
}

export const getServerSideProps: GetServerSideProps = async (
  context: GetServerSidePropsContext,
) => {
  const { search: searchQuery = '' } = context.query
  const ssg = await generateSSGHelper(context)

  if (searchQuery?.length && searchQuery.length >= 1) {
    // `prefetch` does not return the result and never throws - if
    // you need that behavior, use `fetch` instead.
    await ssg.spotify.getSearch.prefetch({
      searchQuery: searchQuery as string,
    })
  }

  return {
    props: {
      // trpcState: ssg.dehydrate()
    },
  }
}

I didn't return anything in the props because I was already getting an unserializable error that started after authenticating in in the ssgHelper. I would really appreciate any help!

Data Transformers | tRPC

You are able to serialize the response data & input args. The transformers need to be added both to the server and the client.

TRPC: How to use different transformers

TRPC: How to use different transformers

Similar Threads

Similar Threads

Similar Threads