Home > Mobile >  Requesting Data from API Controller using GET with data as complex object
Requesting Data from API Controller using GET with data as complex object

Time:10-02

I have, until today always used POST to get response from API Controllers in .NETCore/MVC applications, but have been struggling with performance and have noted that POST cannot be cached...

So, I am trying to change things to use a GET request.

I do not like this, because I would prefer the data sent as a form, not in the URL... but if it must, it must

Anyway, I am having trouble getting .NET to serialize data posted using an object in the AJAX post (using jQuery or otherwise, I don't care)

My controller looks like this:

    [HttpGet]
    [Route("ProductStockHistory")]
    public async Task< ChartResponse> ProductStockHistory([FromQuery] ChartQuery value)
    {
     //// do stuff
    }

You can see I want to send a ChartQuery object, this looks like this:

    public class ChartQuery
    {
        public string dateFrom { get; set; }
        public string dateTo { get; set; }
        public string groupBy { get; set; } = "month";
        // more values...
    }

Using a POST, I would do this: (with the [HttpGet] attribute changed to [HttpPost] and [FromQuery] changed to [FromBody])

        $.ajax({
            type: "POST",
            url: "/Chart/"   chartAction,
            contentType: "application/json",
            dataType: "json",
            data: JSON.stringify({
                dateFrom : dateFromValue, 
                dateTo : dateToValue, 
                groupBy : groupByValue, 
                // more values...
            }),
            success: function (data) {
                // do stuff
            }
        });

This works fine... but as per my opening statement, I cannot cache a POST request/response.

You can probably tell I am trying to get data for a chart, so it is not changing, therefore a cached response is adequate for me.

I have tried many variations of the AJAX code and the most logical to me looks like this:

        $.ajax({
            type: "GET",
            url: "/Chart/"   chartAction,
            contentType: "application/json",
            dataType: "json",
            data: { value: JSON.stringify({
                dateFrom : dateFromValue, 
                dateTo : dateToValue, 
                groupBy : groupByValue, 
                // more values...
            })},
            processData: true, 
            success: function (data) {
                // do stuff
            }
        });

This is generating a URL like: /Chart/ProductStockHistory?value={"dateFrom ":dateFromValue,"dateTo":dateToValue}, which looks about right, but .NET is not serializing the value, I'm getting a null/default object as value in my controller.

It's entirely possible that I am approaching it wrong, but how can I get a cached response when using a complex object as a value in a controller?

EDIT: note, I realise I could change the controller to receive individual values of the ChartQuery object, but that is not what I am trying to achieve

CodePudding user response:

You dont need to call JSON.stringify on your ajax request. Something like this should work:

data:{
 dateFrom : dateFromValue, 
 dateTo : dateToValue, 
 groupBy : groupByValue, 
}

This should produce a request url like this: /Chart/ProductStockHistory?dateFrom=dateFromValue&dateTo=dateToValue&groupBy=groupByValue

.net core binds those values then correctly to your ChartQuery model.

  • Related