直接到python生成的html的ajaxjson查询未定义

2024-06-13 13:51:50 发布

您现在位置：Python中文网/ 问答频道 /正文
8834 3

我已经挣扎了三个星期了，我已经到了死胡同了。系统管理员是s*tty开发人员：）

我尝试构建轻量级cgi-bin python脚本来收集数据并将其转换为json格式。 然后我使用纯html页面对python脚本进行ajax查询，以获取数据并绘制图表（定期地，人们喜欢实时的东西）

这些应该尽可能的轻，因为它们能起到覆盆子的作用。在

我收集数据的python脚本之一

#!/usr/bin/python

import sqlite3
import gviz_api

# enable debugging
import cgitb
cgitb.enable()

def dict_factory(cursor, row):
    d = {}
    for idx, col in enumerate(cursor.description):
        d[col[0]] = row[idx]
    return d

connection = sqlite3.connect("templog.db")
connection.row_factory = dict_factory
cursor = connection.cursor()
cursor.execute("select temp, status from data where ID = (select MAX(ID) from data)")
# fetch all or one we'll go for all.
results = cursor.fetchall()
connection.close()

schema = {"temp": ("number", "temp"),"status": ("number", "status")}
data = results

# Loading it into gviz_api.DataTable
data_table = gviz_api.DataTable(schema)
data_table.LoadData(data)
json = data_table.ToJSon(columns_order=("temp", "status"),order_by="temp")
#print results

#print "Content-type: application/json\n\n"
print "Content-type: application/json"
print

print json

当我在我的浏览器上打开它时，它就像一个魅力，它为我提供了我所需要的googlejsapi格式

^{pr2}$

下面是我的html，它需要python脚本中的json数据来绘制图表

    <html>
  <head>
    <!--Load the AJAX API-->
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">

    // Load the Visualization API and the piechart package.
    google.load('visualization', '1', {'packages':['corechart']});

    // Set a callback to run when the Google Visualization API is loaded.
    google.setOnLoadCallback(drawTable);

    function drawTable() {
      var jsonData = $.ajax({
          type: "GET",
          url: "http://192.168.1.123:8099/cgi-bin/test.py",
          dataType:"json",
          async: false
          }).responseText;
          alert(jsonData);

      // Create our data table out of JSON data loaded from server.
      var data = new google.visualization.DataTable(jsonData);

      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
      chart.draw(data, {width: 400, height: 240});
    }

    </script>
  </head>

  <body>
    <!--Div that will hold the pie chart-->
    <div id="chart_div"></div>
  </body>
</html>

不幸的是，当html直接对python脚本进行ajax查询时，我收到了“undefined”警报。在

然后我将json输出1:1复制到纯静态html文件中，并将ajax URL替换为.html而不是dynamic.py，这样就可以了。在

我的问题是-我尝试做的事情是否有一些限制，或者我的代码有什么问题？在

我的代码基于示例 https://developers.google.com/chart/interactive/docs/php_examplehttps://developers.google.com/chart/interactive/docs/dev/gviz_api_lib


Tags： the脚本apijsondatahtmltypegoogle
1条回答
网友
1楼 · 发布于 2024-06-13 13:51:50

如果我正确地读取了您的javascript，responseText属性只在请求完成之后设置。通常，这些东西是异步执行的，所以您注册一个函数，以便在接收到数据后调用它。e、 g

function drawTable() {
  var drawChart = function(jsonData) {
      // Create our data table out of JSON data loaded from server.
      var data = new google.visualization.DataTable(jsonData);

      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
      chart.draw(data, {width: 400, height: 240});
  };

  $.ajax({
      type: "GET",
      url: "http://192.168.1.123:8099/cgi-bin/test.py",
      dataType:"json",
      async: false
  }).done(drawChart);

}

更多的例子可以在jquery ajax documentation中找到。在

相关问题 更多 >

    编程相关推荐