在jQuery数据表中进行Ajax调用时未得到响应 [英] Not getting response while ajax call in jQuery Data table

问题描述

我尝试在单独的页面中进行ajax调用，但工作正常，但是通过jQuery数据表却没有得到响应.

I tried ajax call in separate page it's working fine but through jQuery data table I'm not getting response.

API在AWS中.我尝试通过密钥访问API端点.

API is in AWS. I tried though API end point with key.

问题是尝试在jQuery数据表中进行ajax请求时，请求有效负载未正确发送，它显示了加密数据，并且未返回任何响应.

Problem is while trying ajax request in jQuery data table the request payload not send properly it shows an encryption data and also not return any response.

示例代码如下:

var dataListNew = {"fromDate":"2021-01-01"，"toDate":"2021-01-14"};

var dataListNew = { "fromDate": "2021-01-01", "toDate": "2021-01-14"};

$('#co-table').DataTable({          
        //"scrollY": "400px",
         dom: 'Bfrtip',
         buttons: [
                    {
                        extend:    'copyHtml5',
                        text:      '<i class="fa fa-files-o"></i>',
                        titleAttr: 'Copy'
                    },
                    {
                        extend:    'excelHtml5',
                        text:      '<i class="fa fa-file-excel-o"></i>',
                        titleAttr: 'Excel'
                    },
                    {
                        extend:    'csvHtml5',
                        text:      '<i class="fa fa-file-text-o"></i>',
                        titleAttr: 'CSV'
                    },
                    {
                        extend: 'pdfHtml5',
                        orientation: 'landscape',
                        //pageSize: 'LEGAL',
                        text:      '<i class="fa fa-file-pdf-o"></i>',
                        titleAttr: 'PDF'
                    },
                    {
                        extend:    'print',
                        text:      '<i class="fa fa-print"></i>',
                        titleAttr: 'Print'
                    }
                ],                  
                            
        "ajax": {
             url         : applicationApiEndPoint+page,
             method      : "POST",
             dataType    : "json",
             data        : JSON.stringify(dataListNew)
             headers    : {
                    "authorizationToken":   authorizationToken,
                    "Cache-Control"     :   "no-cache, no-store",
                    "Content-Type"      :   "application/json; charset=utf-8",
                    "x-api-key"         :   applicationApiKey,
                    "sciappID"          :   appID,
                    "sciappuserID"      :   userID
            }
        },
        
        "columns": [
            { "data": "PROCESSDATE" },
            { "data": "MODELNAME" },
            { "data": "MODELSTARTTIME", 
                render: function (data, type, row)
                {....

[请求有效载荷] [它看起来已经完全加密了]

[Request Payload][it look like fully encrypted]

推荐答案

您具有以下变量，该变量包含要在请求中发送到服务器的对象:

You have the following variable containing the object you want to send to the server in your request:

var dataListNew = { "fromDate": "2021-01-01", "toDate": "2021-01-14"}; 

在DataTables ajax调用中，您正在对该变量进行字符串化:

In your DataTables ajax call you are stringifying this variable:

data: JSON.stringify(dataListNew), // note you have a missing comma in your version

但是JSON.stringify将导致JSON对象转换为字符串-然后data选项将尝试按以下方式解释该字符串:

But JSON.stringify will cause the JSON object to be converted to a string - and then the data option will try to interpret that string as follows:

当数据作为字符串传递时，应该已经使用针对contentType的正确编码进行了编码，默认情况下为application/x-www-form-urlencoded.

有关详细信息，请参见 jQuery ajax文档.

See the jQuery ajax documentation for details.

在您的情况下，字符串无法正确编码才能正常工作.相反，您将获得所看到的URL编码数据:

In your case, the string is not encoded correctly for that to work. Instead, you will get the URL-encoded data you are seeing:

0=%7B&1=%22&2=f&3=r&4=o&5=m&6=D&7=a&8=t&9=e&10=%22&11...

相反，只需将JSON对象传递给ajax data选项:

Instead, just pass the JSON object to the ajax data option:

data: dataListNew,

现在，将根据以下文档准则构造请求有效负载:

Now, the request payload will be constructed as per the following documentation guidelines:

当数据是对象时，jQuery从对象的键/值对生成数据字符串...

现在，请求正文中的有效负载如下:

Now the payload looks like this in the request body:

fromDate=2021-01-01&toDate=2021-01-14

因此，您的服务器端PHP逻辑应该能够以通常的方式读取请求正文.

And therefore your server-side PHP logic should be able to read the request body in the usual way.

这篇关于在jQuery数据表中进行Ajax调用时未得到响应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！