Parsing JSON into TListBox

Question

Good evening guys!

I'm currently trying to put together a CloudFlare client for the desktop. I've connected to their API and successfully retrieved the JSON results with a POST request (the results of which have been output into a TMemo). I'm now wanting to parse these results into a TListBox (see bolded area for example). The project is being designed in Firemonkey.

Here's the formatted layout of the response with some example content;

{
 - response: {
   |- ips: [
      |- {
         ip: "xxx.xxx.xxx.xxx",
         classification: "threat",
         hits: xx,
         latitude: null,
         longitude: null,
         zone_name: "domain-example1"
         },
       - {
         ip: "yyy.yyy.yyy.yyy",
         classification: "robot",
         hits: yy,
         latitude: null,
         longitude: null,
         zone_name: "domain-example2"
         }
       ]
   }
  result : "success",
  msg: null
}

I've tried several different components - SuperObject, Paweł Głowacki's JSON Designtime Parser, Tiny-JSON, LKJSON and the built in DBXJSON. However, i've no experience with JSON at all and i can't seem to find the most basic of examples that i can get started from. Many of them show sample data, but all the ones i've tried don't seem to work as i'd expect, most likely because i'm misunderstanding them. I'd assume the components work, so i need guidance on getting started.

There are hundreds, often thousands, of results in the ips "array" (i apologise if that's not correct, i'd assume it's known as an array but again, i'm completely new to JSON).

What i'm really looking for is some sort of extremely basic sample code which i can build from (along with what component it uses for parsing and such).

For example, if i wanted to grab every ip from the JSON results, and put each one as a separate item into a TListBox (using TListBox.add method), how would i go about achieving this?

When i say ip, i mean the value (in the formatted layout above, this would be xxx.xxx.xxx.xxx or yyy.yyy.yyy.yyy).

Additionally, if i wanted to find a "record" (?) by it's IP from the JSON results and output the data to a delphi array - e.g.;

Result : Array of String = ['"xxx.xxx.xxx.xxx"','"threat"','xx','null','null','"domain-example1"'];

is that possible with JSON? (If this is seen as a separate question or too unrelated, please feel free to edit it out rather than close the question as a whole).

The closest i got to this had not only the ip's, but every other piece of data in a seperate TListItem (i.e. response, ips, ip, classification, xxx.xxx.xxx.xxx and everything else had it's own item, along with several empty items in between each non-empty item).

I'm sure it's extremely simple to do, but there's so much information on JSON that it's a little overwhelming for people new to the format.

Best Regards, Scott Pritchard.

Solution 1

JSON is very simple and easy to figure out, once you understand the basic concepts. Have a look at http://json.org, where it explains things.

There are 4 basic concepts in JSON:

A value is any JSON element: a basic string or number, an array, or an object. (Anything but a pair.)

An array should be a familiar concept: an ordered list of values. The main difference from Delphi arrays is that JSON arrays don't have a defined type for the elements; they're simply "an array of JSON values."

A pair is a key-value pair. The key can be a string or a number, and the value can be any JSON value.

An object is an associative map of JSON pairs. You can think of it conceptually as a TDictionary<string, JSON value>.

So if I wanted to take a JSON array of data like that, and put it in a TListBox, I'd do something like this (DBXJSON example, warning: not tested):

procedure TMyForm.LoadListBox(response: TJSONObject);
var
  i: integer;
  ips: TJSONArray;
  ip: TJSONObject;
  pair: TJSONPair;
begin
  ListBox.Clear;
  pair := response.Get('ips');
  if pair = nil then
    Exit;
  ips := pair.value as TJSONArray;
  for i := 0 to ips.size - 1 do
  begin
    ip := ips.Get(i) as TJSONObject;
    pair := ip.Get('ip');
    if pair = nil then
      ListBox.AddItem('???', ip.Clone)
    else ListBox.AddItem(pair.JsonString, ip.Clone);
  end;
end;

Then you have a list of IP addresses, and associated objects containing the full record that you can get at if the user selects one. (If you wanted to put the entire contents of each record into the list control, have a look at TListView. It works better than TListBox for that.)

And if you want to build an array of strings containing all the values, do something like this:

function JsonObjToStringArray(obj: TJsonObject): TArray<string>;
var
  i: integer;
begin
  SetLength(result, obj.Size);
  for i := 0 to obj.Size - 1 do
    result[i] := obj.Get(i).JsonValue.ToString;
end;

This is all just sample code, of course, but it should give you something to build on.

Solution 2

EDIT2: AV Fixed with extreme ease.

EDIT: After further examining my own code, i realised it would cause a massive amount of memory leaks. However, i have since switched over to SuperObject and found the same result can be achieved in 2 lines of code with only 2 variables and no memory leaks;

Procedure ParseIPs;
  ISO : ISuperObject;
  MyItem : ISuperObject;
begin
  ISO := SO(RetrievedJSON);
  for MyItem in ISO['response.ips'] do Memo2.Lines.Add(MyItem.S['ip']);
end;

RetrievedJSON is simply a string containing the unparsed, plaintext JSON (i.e. not a JSONString but an actual string).

I've left the original code underneath for sake of continuity.

---

With assistance from Mason Wheeler in an earlier answer, as well as an answer provided by "teran" on question 9608794, i successfully built the following to parse down to the actual level (i.e. the "array" containing the data) i needed to access, and then output all items with a specific JSONString.Value into a listbox (named LB1 in the sample below);

Procedure ParseIP;
var
  o, Jso, OriginalObject : TJSONObject;
  ThePair, JsPair : TJSONPair;
  TheVal, jsv : TJSONValue;
  jsArr : TJsonArray;
  StrL1 : String;
  i, num : Integer;
begin
  num := 0;
  o := TJSONObject.ParseJSONValue(TEncoding.ASCII.GetBytes(Memo1.Text), 0) as TJSONObject;
  ThePair := o.Get('response');
  TheVal := ThePair.JsonValue;
  STRL1 := TheVal.ToString;
  JSV := TJSONObject.ParseJSONValue(STRL1);
  OriginalObject := JSV as TJSONObject;
  JSPair := OriginalObject.Get('ips');
  JSARR := JSPair.JsonValue as TJSONArray;
  for i := 0 to JsArr.Size-1 do
    begin
      JSO := JSArr.Get(i) as TJSONObject;
      for JSPAIR in JSO do
        begin
        num := num+1;
          if JSPAIR.JsonString.Value = 'ip' then
          begin
            LB1.Items.Add(JSPair.JsonValue.Value);
          end
          else null;
        end;
    end;
    ShowMessage('Items in listbox: ' + IntToStr(LB1.Items.Count));
    ShowMessage('Items in JSON: ' + IntToStr(num div JSO.Size));
    Jsv.Free;
end;

While this is an extremely round-about way of doing it, it allows me to look at each individual step, and see where it's iterating down through the JSON and with extreme ease, and to change it into a function where i can output any piece or range of data as a result based on one of multiple criteria. For the sake of verifying i got the correct number of items, i added 2 ShowMessage routines at the end; One for the items in the listbox, and one for the number of instances of "ip" data that i was parsing.

This code was specifically tested in Firemonkey with CloudFlare API JSON results which were output into a TMemo exactly as they were retrieved (on an &calls_left&a=zone_ips&class=t&geo=1 API call, of course with your zone, token and email appended in addition). It should be relatively easy to modify it to work with other results from the numerous other API calls too.

To clarify, i did try Mason's code, but unfortunately i couldn't get it working. However, i have accepted his answer for the time being on the basis that the explanation he gave on the basics was worthy of it and assisted me in getting to an end-solution and coming up with something i can build from and teach myself.