从 json 数据创建一个表状结构，左侧键和表右侧值，并使用 python Z31976206A7D4BA9 在 html 上显示

Question

我正在尝试创建一个类似结构的表，其中该表有两列（规格，值），所有键 go 进入规格列，这些键的值 go 进入值列。 我有一个 json 文件本地存储在我的系统上。 因此，目标是从 json 文件中获取所有内容，并创建此表结构并将其显示在我的网页上。

这是我的规格路线。 When users click on a button thats in my html page, that button basically runs this function where it fetches the hosts facts, and stores that json data in a file called hostsfacts.json. 我希望能够从 json 数据创建我上面描述的表，并将该表传递给 provision.html。

@app.route('/Specs', methods=['GET', 'POST'])
def Specs():
ID = request.form["foremanId1"]
print(ID)
response10 = requests.get('https://test.com/api/hosts/{v1}/facts'.format(v1=ID), auth=('abc', 'password'), verify=False)
if response10.status_code == 200:
    myDictForHostsFacts = json.loads(response10.content.decode('utf-8'))
    resultForHostsFacts = json.dumps(myDictForHostsFacts)

with open("static\hostsFacts.json", "w") as hostsFactsFile:
    add_text1 = (resultForHostsFacts)
    print(add_text1, file=hostsFactsFile)
    hostsFactsFile.close()

return render_template('provision.html')

这是我的 json 文件：

{"total": 366, "subtotal": 1, "page": 1, "per_page": 320, "search": " host = 529", "sort": {"by": null, "order": null}, "results": {"mac7287327223": {"memory::system": null, "dmi::board": null, "disks::sdb::size_bytes": "0", "nmprimary_ipv4_dns-priority": "0", "nmprimary_ipv6_dns-priority": "0", "nmprimary_802-3-ethernet_speed": "0", "nmprimary_ipv4_route-table": "0", "nmprimary_ipv6_route-table": "0", "dmi::bios::release_date": "03/08/2022", "bios_release_date": "03/08/2022", "disks::sdb::size": "0 bytes", "partitions::/dev/loop2::size": "1.56 GiB", "partitions::/dev/mapper/live-rw::size": "1.56 GiB", "partitions::/dev/mapper/live-base::size": "1.56 GiB", "partitions::/dev/loop4::size": "1.56 GiB", "processorcount": "16", "processors::count": "16", "nmprimary_dhcp4_option_expiry": "1661435487", "partitions::/dev/loop2::size_bytes": "1677721600", "partitions::/dev/mapper/live-rw::size_bytes": "1677721600", "partitions::/dev/loop4::size_bytes": "1677721600"}}}

所以，我只想用 mac7287327223{} 里面的内容创建表。 我希望有类似下表的内容：

| 规格 | 价值 |

| memory::系统 | null |

---

| dmi::板 | null |

---

| 磁盘::sdb::大小 | 0 字节 |

---

| 处理器数量 | 16 |

我很难在 stackoverflow 中格式化这个表，所以我只是这样说，给大家一个想法。

如果您想查看 provision.html，这非常简单，因为我只想在此处显示此表。 因此，它所拥有的只是带有表格的主体标签。 就这样。

所以，我基本上是在努力实现这一点，我一直很难弄清楚这个问题，因为我真的需要为此使用 python。

如果可以，请你帮助我。 任何帮助将不胜感激。

Answer 1

您不需要将数据存储在 .json 文件中，除非您想永久保存它。

在 Flask 中，您可以将数据传递给render_template() function：

if response10.status_code == 200:
    myDictForHostsFacts = json.loads(response10.content.decode('utf-8'))
    # ...
    return render_template('provision.html', data=myDictForHostsFacts)

然后，在您的 HTML 中，您可以使用 jinja2 语法访问该字典。 Jinja2 是一个模板工具，它基本上允许您在 html 文档中使用 python 代码

<table class="table table-dark">
    <thead class="thead thead-dark">
      <tr>
        <!-- Your Columns HERE -->
        <th class="header text-left" scope="col">Key</th>
        <th class="header text-left" scope="col">Value</th>
    
      </tr>
    </thead>
    <tbody id="temp-table">
      {% for entry in data%}
      <tr>
        <td class="text-left">{{entry}}</td>
        <td class="text-left">{{data[entry]}}</td>
       
      </tr>
      {% endfor %}
    </tbody>
  </table>

上面的 HTML 代码是我自己编辑的一些代码。 我建议看一下 jinja2 的文档，它非常有用。