JSON data issues with Neon

I recently migrated from Supabase to Neon, and I noticed that any JSON data I fetch from my database has to be parsed, as it is provided as a string. This was not the case with Supabase despite the data types being the same (jsonb). Also, whenever I tried editing jsonb within the Table Editor by double clicking, it goes from something like [{"x": 1}, {"y"; 2}] to [[object Object], [object Object]]. Why?

5 Replies

national-gold•7mo ago

@Raurok

I recently migrated from Supabase to Neon, and I noticed that any JSON data I fetch from my database has to be parsed, as it is provided as a string. This was not the case with Supabase despite the data types being the same (jsonb).

Can you share the entire code where you're facing this? I'd love to reproduce the problem and get back to you with a solution.

quickest-silverOP•7mo ago

Ok My codebase would be awkward to send to I made a little example that demonstrates my issue:

import prisma from "./db";

(async () => {
  /* manual */
  // set row candidates to [{"x": 1}, {"y": 2}] (i manuallly pasted this data in)
  const rowWithManualJSONInput = await prisma.election.findUnique({
    where: { uuid: "abc" },
  });
  console.log(typeof rowWithManualJSONInput!.candidates); // string (should be object!)

  /* programmatical */
  await prisma.election.create({
    data: {
      uuid: "def",
      startTime: new Date(),
      tiebreaker: {},
      candidates: [{ "x": 1 }, { "y": 2 }], // < this is what to watch
      misc: { archived: true },
      winners: [],
      voters: [],
      id: 4,
    },
  });

  const rowWithProgrammaticalJSONInput = await prisma.election.findUnique({
    where: { uuid: "def" },
  });
  console.log(typeof rowWithProgrammaticalJSONInput!.candidates) // object
})();

import prisma from "./db";

(async () => {
  /* manual */
  // set row candidates to [{"x": 1}, {"y": 2}] (i manuallly pasted this data in)
  const rowWithManualJSONInput = await prisma.election.findUnique({
    where: { uuid: "abc" },
  });
  console.log(typeof rowWithManualJSONInput!.candidates); // string (should be object!)

  /* programmatical */
  await prisma.election.create({
    data: {
      uuid: "def",
      startTime: new Date(),
      tiebreaker: {},
      candidates: [{ "x": 1 }, { "y": 2 }], // < this is what to watch
      misc: { archived: true },
      winners: [],
      voters: [],
      id: 4,
    },
  });

  const rowWithProgrammaticalJSONInput = await prisma.election.findUnique({
    where: { uuid: "def" },
  });
  console.log(typeof rowWithProgrammaticalJSONInput!.candidates) // object
})();

In the top half, i manually set the value of a jsonb column to [{"x": 1}, {"y": 2}]. I then read this value, which turns out to be a string In the bottom half, I programmatically create a similar entry, which when retrieved, is an object But regardless, when I try to edit the entries manually in the DB, they just go from this:

quickest-silverOP•7mo ago

into this:

quickest-silverOP•7mo ago

it doesn't seem intentional, the data should always be an object no? unless it's somthing to do with jsonb as opposed to json

Gaming

Programming

JSON data issues with Neon

Did you find this page helpful?