jQuery 数据表身份验证

Question

我在 jQuery 中对我的 Ajax 请求使用身份验证。我成功地调用了我的 API 来检索 JSON。以前我使用 JSON 输出生成 HTML 但现在我想在我的数据上使用 DataTables。

我在这里链接了两个 Ajax 请求。第一个请求获取商店信息并从中获取零售商 ID。这作为参数传递给我的 API，用于拉动特定零售商的销售额。 myStore 是第一个 Ajax 请求的成功回调。

我已经用 DataTables 尝试了几次不同的迭代，但仍然无法正常工作。

如何在请求中使用身份验证时使用 JSON 数据填充数据表？

function myStore(result) {
            //console.log(result[0].storeid);
            result = result[0];
            $( "#header" ).append(
                result.storename
            );
            $( "#content" ).append(
                "<p>" + result.street + "<br>"
                + result.city + ", " + result.state + " " + result.zipcode + "<br></p>"
            );

            $('#sales_table').dataTable( {
                "fnServerData": function ( sSource, aoData, fnCallback, oSettings ) {
                    oSettings.jqXHR = $.ajax( {
                        "dataType": 'json',
                        "type": "GET",
                        "url": 'api/sales/' + result.retailerid,
                        "beforeSend": function(xhr){
                            xhr.setRequestHeader("Authorization",
                            "Basic " + btoa(storeObject.user + ":" + storeObject.password));
                        },
                    });
                },
                "columns": [
                    { "data": "title" },
                    { "data": "description" }
                ]
            });
        }

Answer 1

DataTables 的 ajax 选项接受多种数据类型，其中之一是 Object，请参阅以下手册摘录：

As an object, the ajax object is passed to jQuery.ajax allowing fine control of the Ajax request. DataTables has a number of default parameters which you can override using this option.

您的代码可以更改如下：

function myStore(result) {
   //console.log(result[0].storeid);
   result = result[0];
   $( "#header" ).append(
      result.storename
   );
   $( "#content" ).append(
      "<p>" + result.street + "<br>"
      + result.city + ", " + result.state + " " + result.zipcode + "<br></p>"
   );

   $('#sales_table').dataTable( {
      "ajax": {
         "url": 'api/sales/' + result.retailerid,
         "dataType": 'json',
         "type": "GET",
         "beforeSend": function(xhr){
            xhr.setRequestHeader("Authorization",
               "Basic " + btoa(storeObject.user + ":" + storeObject.password));
         }
      },
      "columns": [
         { "data": "title" },
         { "data": "description" }
      ]
   });
}

jQuery 数据表身份验证

jQuery DataTables Authentication

jquery

datatables

basic-authentication