使用json / php api将数据从mysql db转换为表

时间:2018-04-14 05:15:04

标签: php json rest api

我试图使用成功运行的JSON和PHP脚本(api.mystem.tk/product)创建自己的api,但是我想将这些数据转换为带有列的html表: id,姓名和日期。

我的问题,怎么样?我已经包含了我的代码,你可以在api.mystem.tk/product的控制台中观看JSON输出。我已删除脚本中的所有私人详细信息,并将其替换为#______。

api.php

<?php
  $connect = mysqli_connect('#host', '#user', '#password', '#db');
  if(!isset($_GET['function'])) {
    die('Some error occurred!');
  }
  function GetProducts($db) {
    $sql = mysqli_query($db, 'SELECT * FROM php_test ORDER BY Id ASC LIMIT 
      0, 10');
    $data = array();
    if (mysqli_num_rows($sql) > 0) {
      while ($row = mysqli_fetch_array($sql)) {
        $data[] = $row["Id"];
        $data[] = $row["Name"];
        $data[] = $row["Date"];
      }
    }
    $data = json_encode($data);
    echo $_GET['jsonCallback'].'('.$data.')';
  }
  if (function_exists($_GET['function'])) {
    $_GET['function']($connect);
  }
  echo $data;
?>

功能的.js:

$(function(){
  var functionName = 'GetProducts';
  function LoadData() {
    $.getJSON("http://api.mystem.tk/product/api.php? 
    function="+functionName+"&jsonCallback=?", function(data) {
      var all_data = [];
      $.each(data, function(k, name){
        var array_data = '<div class="names">'+name+'</div>';
        all_data.push(array_data);
      });
      $('#data').append(all_data);
      console.log(data);
    });
  }
  LoadData();
});

索引 .PHP:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title> API TEST </title>
    <meta name="viewport" content="width=device-width,initial- 
      scale=1,maximum-scale=1,user-scalable=0">
    <script src="https://code.jquery.com/jquery-3.3.1.min.js" 
      integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" 
      crossorigin="anonymous"></script>
  </head>
  <body>
    <div id="data"></div>
    <script type="text/javascript" src="function.js"></script>
  </body>
</html>

2 个答案:

答案 0 :(得分:1)

您需要使用 jQuery.parseJSON() jQuery函数解析 function.js 中的JSON数据。 您可以阅读以下简要文档:jQuery.parseJSON()

添加了代码:

<script>

var obj = JSON.stringify([
    {
        "id":'1',
        "name":'Jhon Doe',
        "date":'April 14,2018'
    },
    {
        "id":'2',
        "name":'Coder',
        "date":'April 23, 2018'
    }
]);
var jsontoparse = JSON.parse(obj);
var i = obj.length;
var j=0;
while(j<=i){
    console.log(jsontoparse[j].id);
    j = j+1;
}
</script>

答案 1 :(得分:1)

所以我尝试使用$ .parseJSON而不是$ getJSON,但没有成功 控制台:

Uncaught SyntaxError: Unexpected token <
at m (jquery-3.3.1.min.js:2)
at Function.globalEval (jquery-3.3.1.min.js:2)
at text script (jquery-3.3.1.min.js:2)
at Ut (jquery-3.3.1.min.js:2)
at k (jquery-3.3.1.min.js:2)
at XMLHttpRequest.<anonymous> (jquery-3.3.1.min.js:2)

我改变了这个:

$data[] = $row["Id"];
$data[] = $row["Name"];
$data[] = $row["Date"];

到此:

$data[] = array(
  'id' => $row["Id"],
  'name'=> $row["Name"],
  'date'=> $row["Date"]
)

更具体一点......