Разбивка данных JSON с помощью Flask

Question

Я использую колбу и создаю таблицы, которые заполнены данными JSON, которые я получаю.Проблема, с которой я столкнулся сейчас, заключается в том, что мне нужно разбить на страницы все данные JSON, поскольку максимальное значение для каждой страницы установлено равным 50, и я хочу показать все продукты в моей таблице.

Пока что я не могу заставить это работать, и я действительно не знаю, как заставить это работать с Flask.Я попытался использовать цикл while, но он не работает с Jinja2, потому что эта команда не распознается.

Это мой код Python:

@app.route('/products',methods = ['POST', 'GET'])
def products():
    shopnaam = request.form['shopname'] 
    username = request.form['username']
    password = request.form['password']
    login = 'https://'+shopnaam+'example.com'
    url = 'https://'+shopnaam+'.example.com/admin/products.json'

    payload = {
          'login[email]': username,
          'login[password]': password
          }

    with requests.Session() as session:
          post = session.post(login, data=payload)

          r = session.get(url)
          parsed = json.loads(r.text)


    return render_template('producten.html',parsed = parsed)

Это мой код Jinja2:

<button class="collapsible">Bekijk product Informatie</button>
<div class="content">
<table id = "productentabel">
  <tr class = "header">
    <th>ID</th>
    <th>Titel </th>
    <th>Prijs Exclusief BTW</th>
    <th>Prijs Inclusief BTW</th>
    <th>Datum</th>

    {% for product in parsed['products'] %}
    <TR>
    <TD  width="100px" >{{product['id']}}</TD>
    <TD  width="300px" >{{product['nl']['title']}}</TD>
    <TD  width="150px">{{product['price_excl']}}</TD>
    <TD  width="150px">{{product['price_incl']}}</TD>
    <TD  width="300px">{{product['created_at']}}</TD>
    </TR>
    </tr>
    {% endfor %}
    </table>

<input class = "exportknop" value="Exporteer product informatie" type="button" onclick="$('#productentabel').table2CSV({header:['ID','Titel','Prijs Exclusief BTW', 'Prijs Inclusief BTW', 'Datum']})">     
</div>

Как вы можете видеть, я использую цикл for, этот код работает, но проблема заключается в разбиении на страницы.

Мой JSON выглядит следующим образом:

products: [
{
article_code: "123",
barcode: "456",
brand_id: 2600822,
created_at: "2018-05-31T15:15:34+02:00",
data01: "",
data02: "",
data03: "",
delivery_date_id: null,
has_custom_fields: false,
has_discounts: false,
has_matrix: false,
hits: 0,
hs_code: null,
id: 72660113,
image_id: null,
is_visible: false,
price_excl: 33.0165,
price_incl: 39.95,
price_old_excl: 0,
price_old_incl: 0,
product_set_id: null,
product_type_id: null,
search_context: "123 456 789",
shop_id: 252449,
sku: "789",
supplier_id: 555236,
updated_at: "2018-05-31T15:15:34+02:00",
variants_count: 1,
visibility: "hidden",
weight: 0,

links: {
first: ".json",
last: ".json?page=70",
prev: null,
next: ".json?page=2",
count: 3497,
limit: 50,
pages: 70
}

Так что ссылки - это то, где происходит разбиение на страницы, я попробовал следующее в своем коде Python, и с этим я получаювсе значения напечатаны в моем терминале python.Только я не могу отправить данные в таблицы.

while url:
        with requests.Session() as session:
            post = session.post(login, data=payload)
            r = session.get(url)
            parsed = json.loads(r.text)
            for product in parsed['products']:
                print(product['id'], product['nl']['title'])
            url = 'https://example/admin/products' + parsed['links']['next']  

Answer 1

Итак, пара вещей, чтобы рассмотреть здесь. Во-первых, использование генератора для создания веб-контента практически невозможно за пределами веб-сокета или асинхронных вызовов. Причина в том, что WSGI нужны все данные, чтобы получить их до того, как они будут обработаны. Затем он закрывает соединение. Вы можете получить данные, но в таблице это вызовет проблемы в необработанном HTML.

Что делать:

Я бы использовал что-то вроде datatables (datatables.net), чтобы подать данные вашей таблицы в переменную и позволить datatables обрабатывать разбиение на страницы для вас.

Пример использования Bootstrap 4 и DataTables.

<script>
var dataSet = []
var wurl = ""

tablex = $('#tablex').dataTable( {
    select: true,
    stateSave: true,
    colReorder: true,
    deferRender: true,
    "oLanguage": {"sSearch": "Filter:"},
    columns: [
        { title: "Number" },
        { title: "Client Name" },
        { title: "Opened" },
        { title: "Closed" },
        { title: "Worked" }
    ]
} );

function generate() {
$.get(wurl, function( data ) {
  dataSet = data;
  tablex.fnDestroy();
  tablex = $('#tablex').dataTable( {
    data: dataSet,
    select: true,
    stateSave: true,
    colReorder: true,
    deferRender: true,
    "oLanguage": {"sSearch": "Filter:"},
    columns: [
        { title: "Number" },
        { title: "Client Name" },
        { title: "Opened"},
        { title: "Closed"},
        { title: "Worked"}
    ],
} );
});
};

$(document).ready(function() {
wurl = '/api/getdata';
generate()
} );

</script>

Сначала я устанавливаю только базовую таблицу, а затем вызываю API и загружаю эту таблицу с данными в фоновом режиме. Вы можете даже провести этот опрос и обновить набор данных с интервалом, если хотите. API просто доставляет необработанные данные в столбец вывода.

В этом примере идентификатор вашей таблицы - "tablex".
Ваш маршрут API может быть любым, просто возвращаемым значением вашего вывода в формате столбцов и строк.