将 AWS MySQL 查询的 JSON 输出并在网页上显示为 DataTable

Question

我已通过 AWS API Gateway 成功地将网页连接到 Lambda 函数，以在 Aurora Serverless MySQL 数据库上调用 SQL 查询。我只是将完整的返回 JSON（以字符串形式）传递给网页，它会出现，例如，如下所示：根据查询，列可能不同。我希望能够获取响应输出并使用网站上的 DataTable 将其可视化。有没有办法动态创建 DataTable，大概是通过访问 JSON 对象中的特定键（不是字符串形式）？免责声明：除此之外，我对 JavaScript/jQuery/JSON 格式的经验很少。

Answer 1

以下是如何使用数据表。您需要首先在要显示数据表的 html 中声明一个 div。

<div class="container-fluid">

  <div id="data-table-container"></div>

</div>

然后在您的 jquery 代码中，初始化 DataTable

$.ajax({

  method: 'POST',

  url: '***',

  success: function (response) {

    // format the column labels to [{data: 'Column Name 1'}]

    const colLabels = response.sqlStatementResults[0].resultFrame.resultSetMetadata.columnMetadata.map(value => {

      return {

        data: value

      }

    })

    $('#data-table-container').DataTable({

      data: JSON.stringify(response.sqlStatementResults[0].resultFrame.records),

      columns: colLabels

    })

  },

  error: function ajaxError(error) {

  }

})

这是文档 https://datatables.net/manual/data/