Deserializing GET QueryString arrays

1

I have an angularJS (1.X) app serializing a querystring paramter which is an array of values, and sending that to a ServiceStack service.

The JSON object being serialized by angular is:

{
    FromDateUtc: "2018-04-22T12:00:00.000Z",
    ToDateUtc:"2018-04-25T11:59:59.999Z",
    PeriodRanges: [
        {FromDateUtc:"2018-04-22T12:00:00.000Z",ToDateUtc:"2018-04-23T11:59:59.999Z"},
        {FromDateUtc:"2018-04-23T12:00:00.000Z",ToDateUtc:"2018-04-24T11:59:59.999Z"},
        {FromDateUtc:"2018-04-24T12:00:00.000Z",ToDateUtc:"2018-04-25T11:59:59.999Z"}
    ]
}

Angular serializes the PeriodRanges property as a QueryString param on the wire as:

PeriodRanges=%7B%22FromDateUtc%22:%222018-04-22T12:00:00.000Z%22,%22ToDateUtc%22:%222018-04-23T11:59:59.999Z%22%7D&PeriodRanges=%7B%22FromDateUtc%22:%222018-04-23T12:00:00.000Z%22,%22ToDateUtc%22:%222018-04-24T11:59:59.999Z%22%7D&PeriodRanges=%7B%22FromDateUtc%22:%222018-04-24T12:00:00.000Z%22,%22ToDateUtc%22:%222018-04-25T11:59:59.999Z%22%7D

decoded (for easier reading):

PeriodRanges={"FromDateUtc":"2018-04-22T12:00:00.000Z","ToDateUtc":"2018-04-23T11:59:59.999Z"}&PeriodRanges={"FromDateUtc":"2018-04-23T12:00:00.000Z","ToDateUtc":"2018-04-24T11:59:59.999Z"}&PeriodRanges={"FromDateUtc":"2018-04-24T12:00:00.000Z","ToDateUtc":"2018-04-25T11:59:59.999Z"}

Now that arrives at my service, for a DTO defined as:

    public class HasReportAndPeriodRanges
    {
        public DateTime FromDateUtc { get; set; }

        public DateTime? ToDateUtc { get; set; }

        public List<PeriodRange> PeriodRanges { get; set; }
    }

    public class PeriodRange
    {
        public DateTime FromDateUtc { get; set; }

        public DateTime ToDateUtc { get; set; }
    }

Which is not correctly getting deserialized.

I’ve not encountered using arrays as GET QueryStrings in ServiceStack.
Do I have to something special to make that GET request serialize properly?

2

You can only send complex types on QueryStrings using JSV, If you want to send JSON you need to send it in the Request Body, e.g. using POST/PUT/PATCH.

3

Ah OK! so I need to do something special in the angular to convert that stuff to a JSV value then?
OR option 2, redesign to be a POST method.

4

Is there anything (library etc) that can help me serialize my value to JSV in the angular code?

5

JSV provides a human friendly way to construct urls manually, e.g

?data=[{a:1},{b:2}]

But if you’re trying to send a serialized object then I’d use POST.

6

Thanks. I used the: JSV.serializeArray() method from: https://github.com/ServiceStack/ServiceStack/blob/master/lib/js/JSV.js

As I dont think converting to a POST is semantically the right thing to do in this case.
Worked a treat actually.

cheers

7

Semantically ?queryStrings should not have complex types, and why there’s no standard for it.