datatable only loading not working

When I set the serverSide: true, the datatable is forever loading how to fix it?

This is my datatable code

        $('#generated-report').DataTable({
                "processing": true,
                "serverSide": true,
                "ajax": {
                    url: "call_ajax.php",
                    type: "POST",
                    data: function(d)
                    {
                        d.from = from;
                        d.to = to;
                        d.mark_id = mark_id;
                        d.product_id = product_id;
                        d.verification_id = verification_id;
                        d.captcha = captcha;
                    }
                },
                "columns": [
                    { data: 'value_1' },
                    { data: 'value_2' },
                    { data: 'value_3' },
                    { data: 'value_4' },
                ],
                "language": {
                    "processing": "<div class='lds-ring'><div></div><div></div><div></div><div></div></div>",
                },
                "bLengthChange": false,
                "pageLength": 20,
                    "sdom": 'lipr',
        });

and this is how I get the datatables result on the php code, the code below belongs to call_ajax.php

                $result = array(
                    "draw" => 0,
                    "iTotalRecords" => count($result),
                    "iTotalDisplayRecords" => count($result),
                    "aaData" => $result,
                );

                echo json_encode($result, JSON_PRETTY_PRINT);