Передача данных JSON в javascript из python

#javascript #json #python-3.x

#javascript #json #python-3.x

Вопрос:

Я пытаюсь передать некоторые данные, полученные из базы данных с помощью python, в javascript.

Приведенный ниже код работает. Я могу получить доступ к данным в javascript, но я могу передавать только одну строку за раз.

 #!le/usr/bin/env python3
import sys
import re
import datetime
import sqlite3
import json
import time
SQLDB = '/home/daylene/db/PiLN.sqlite3'
db = sqlite3.connect(SQLDB) 
db.row_factory = sqlite3.Row
cursor = db.cursor()
sql = '''SELECT segment, dt, set_temp, temp, pid_output
               FROM firing WHERE run_id=? ORDER BY dt;
          '''
p = ((54),)
cursor.execute(sql, p)
columns = [column[0] for column in cursor.description]
results = []
for row in cursor.fetchall():
    results.append(dict(zip(columns,row)))
print(json.dumps(results[-1]))
  

И рабочий javascript

   <script>
        $(document).ready(function () {
            showGraph();
        });


        function showGraph()
        {
            $.ajax({
              mimeType: 'application/json; charset=iso-8859-1',
              url:  'data.cgi',
              //data: JSON.stringify( query ),
              contentType: "application/json",
              dataType: 'json',
              method: 'POST',
              async: false,
              success:  function (response)
                {
                    //document.write(response);
 
                    var time = response["dt"];
                    var temp = response["temp"];
                    //document.write(response);
                    //for (var i in response) {
                     //   time.push(response.time);
                      //  temp.push(response.temp);
                    //}

                    var chartdata = {
                        labels: time,
                        datasets: [
                            {
                                label: 'time',
                                backgroundColor: '#49e2ff',
                                borderColor: '#46d5f1',
                                hoverBackgroundColor: '#CCCCCC',
                                hoverBorderColor: '#666666',
                                data: temp
                            }
                        ]
                    };

                    var graphTarget = $("#graphCanvas");

                    var barGraph = new Chart(graphTarget, {
                        type: 'bar',
                        data: chartdata
                    });
                }
            
            
        });
    }
        </script>
  

раскомментирование document.write(response);
и изменение на print(json.dumps(results)) не работает. Ничего не возвращается с document.write(response);

Добавление этого не работает

 for row in results:
    results1.append(json.dumps(row))
print(results1)
  

и затем добавление этого также не работает

 results1 = []
for row in results:
    results1.append(json.dumps(row))
print(json.dump(results1)
  

Вывод print(results) (сокращенный)

 [{"segment": 4, "dt": "2020-07-09 19:58:55", "set_temp": 1145, "temp": 1145.02, "pid_output": 83.49}, {"segment": 4, "dt": "2020-07-09 19:59:24", "set_temp": 1145, "temp": 1145.15, "pid_output": 80.76}, {"segment": 4, "dt": "2020-07-09 19:59:54", "set_temp": 1145, "temp": 1145.16, "pid_output": 80.6}, {"segment": 4, "dt": "2020-07-09 20:00:24", "set_temp": 1145, "temp": 1145.15, "pid_output": 80.73}, {"segment": 4, "dt": "2020-07-09 20:00:55", "set_temp": 1145, "temp": 1145, "pid_output": 83.73}, {"segment": 4, "dt": "2020-07-09 20:01:24", "set_temp": 1145, "temp": 1145.08, "pid_output": 82.1}, {"segment": 4, "dt": "2020-07-09 20:01:54", "set_temp": 1145, "temp": 1145.13, "pid_output": 80.99}]
  

Приветствуются любые рекомендации.

Комментарии:

1. Ваш «вывод на печать (результаты) (сокращенный)» выглядит как несколько строк. Если вы запутались, потому что все это печатается в одной строке в консоли. попробуйте: import pprint ; pprint(results)

2. Нет, я знаю, что это больше, чем одна строка. Я хотел бы отправить все это на JavaScript и иметь возможность доступа к данным с помощью response[x][«dt»], где x, если номер строки.

3. Вы должны быть в состоянии. Почему вы используете response["dt"]; вместо response[x]["dt"] ?

4. Это был пример того, что работало. Я могу получить результаты одной строки, переданной в javascript. При попытке передать всю переменную «results» document.write(response); ничего не генерирует в javascript. Таким образом, они передаются неправильно. Я просто понятия не имею, как это исправить.

5. Я не понимаю, как вы возвращаете ответ json. Вы показываете только код, который выводит его в консоль. Попробуйте: return json.dumps(results)

Ответ №1:

Самый простой способ передать данные вашему интерфейсу JS из Python — это создать сервер, который обслуживает HTTP-запросы.

Используя простой flask, например:

 from flask import Flask, jsonify

app = Flask(__name__)

@app.route("/my-data")
def get_data():

    my_data = [{"segment": 4, "dt": "2020-07-09 19:58:55"}, {}]

    return jsonify(my_data)

if __name__ == "__main__":
    app.run(port=8080, host="0.0.0.0")
  

И затем вы можете запросить данные из http://localhost:8080/my-data в вашем Javascript.

Комментарии:

1. Это часть гораздо более крупного проекта, который уже использует шаблоны jinja2 и диаграммы Google. Я пытаюсь перейти на chartjs для автономных диаграмм. Диаграмма будет находиться внутри шаблона и нуждается в динамическом обновлении.

Ответ №2:

Блин, я понял это. Дело было не в коде, а скорее в размере данных, которые я пытался передать. Попытка использовать меньший массив сработала нормально.

Я, наконец, подумал проверить журналы lighttpd, и я получаю это.

(mod_cgi.c.588) response headers too large for /app/data.cgi