Send dynamic JSON from client to server

Question

I have a client side written in JavaScript and a server side in Java on spring boot. I have the following JSON array in my client side.

[
  {
    "names": [
      {
        "default": "somelink"
      },
      {
        "nr": "somelink"
      },
      {
        "pr": "somelink"
      }
    ]
  },
  {
    "circle": [
      {
        "ID": [
          {
            "red": "someData"
          }
        ]
      },
      {
        "ID2": [
          {
            "blue": "somedata"
          }
        ]
      }
    ]
  },
  {
    "square": [
      {
        "ID3": []
      }
    ]
  },
  {
    "triangle": []
  }
]

Now the following properties will always be fixed in the JSON array - names, circle, square, triangle . Now in my application you can add however many of these objects you like. So in this example we have two circles, ID and ID2 , both have some data attached ( red and blue ). We have one square ID3 with no data and no triangles. Each property inside the fixed properties of names, circle, square and triangle can be changed.

Now I would like to send this over to the server side in Java but I am struggling to see how I can do this as my JSON is not static. Can anyone help me out? Thanks in advance

Answer 1

Can you please explain more about what do you mean by struggling to see how your JSON properties changed?

At first glance, I can see you can save your self a lot of work by building the JSON object in a different way:

For the whole JSON object for the main properties like (names, circle, square, triangle), you can instead of creating an object with a value of an array to use the following:

{
"names": [...],
"circle": [...],
"square": [...],
"triangle": [...]
}

For the "names" attribute consider doing this: (at the end it all depends on what type of data(object, array, string,...) you are going to store on each key of (default, nr, pr)

"names": {
    "default": "somelink",
    "nr": "somelink",
    "pr": "somelink"
}

For Circle key:

Instead of:

"circle": [
      {
        "ID": [
          {
            "red": "someData"
          }
        ]
      },
      {
        "ID2": [
          {
            "blue": "somedata"
          }
        ]
      }
    ]

You can do this:

"circle": {
  "ID": [
          {
            "red": "someData"
          }
        ],
  "ID2": [
          {
            "blue": "somedata"
          }
        ]
}

So as a whole object you might structure it as the following:

{

 "names": {
    "default": "somelink",
    "nr": "somelink",
    "pr": "somelink"
},
 
"circle": {
            "ID": [
                   {
                     "red": "someData"
                   }
             ],
            "ID2": [
                    {
                     "blue": "somedata"
                   }
            ]
},

"square": {
            "ID3": []
},

"triangle": []

}