无法在 Django 模板 html 脚本中使用 python 字典作为 JSON

Question

我将 python 字典传递给 Django 模板 html 脚本，如下所示：-

def create_dict(request):
   #creating the dictionary and storing it in py_dict
   py_dict = json.dumps(py_dict)
   context = {
   "py_dict": py_dict
   }
   render(request, 'index.html', context)

在 Django 模板 ( index.html) 中，我按如下方式检索字典：-

def create_dict(request):
   #creating the dictionary and storing it in py_dict
   py_dict = json.dumps(py_dict)
   context = {
   "py_dict": py_dict
   }
   render(request, 'index.html', context)

如果我尝试直接将变量分配给dictDjango 变量（py_dict）而不使用双 qoutes（var dict = {{py_dict}};），那么它会显示Not found & error

实际的Python字典看起来像这样：-

{"19.2.000/": {"19.2.000/dataconversion/": {}, "19.2.000/reim/": {}, "19.2.000/resa/": {}, "19.2.000/rms/": {}}, "19.2.001/": {"19.2.001/dataconversion/": {}}, "19.2/": {"19.2/alloc/": {}, "19.2/rpm/": {}}, "RESA/": {"RESA/folder1/": {}}, "RMS/": {}, "RPM/": {}, "/": {}, "apc/": {"apc/apc_inner/": {}}, "dataconversion/": {}, "folder2/": {}, "merch/": {"merch/19.0.x/": {"merch/19.0.x/19.0.000.1/": {"merch/19.0.x/19.0.000.1/dataconversion/": {}}, "merch/19.0.x/19.0.001/": {"merch/19.0.x/19.0.001/alloc/": {}, "merch/19.0.x/19.0.001/reim/": {}, "merch/19.0.x/19.0.001/resa/": {}, "merch/19.0.x/19.0.001/rms/": {"merch/19.0.x/19.0.001/rms/reports/": {}}, "merch/19.0.x/19.0.001/rpm/": {}}, "merch/19.0.x/19.0.002.1/": {"merch/19.0.x/19.0.002.1/Merged_RC/": {"merch/19.0.x/19.0.002.1/Merged_RC/rms/": {}}, "merch/19.0.x/19.0.002.1/hotfix/": {"merch/19.0.x/19.0.002.1/hotfix/rms/": {}}}, "merch/19.0.x/19.0.002/": {"merch/19.0.x/19.0.002/alloc/": {}, "merch/19.0.x/19.0.002/dataconversion/": {}, "merch/19.0.x/19.0.002/jos_merch/": {}, "merch/19.0.x/19.0.002/reim/": {}, "merch/19.0.x/19.0.002/resa/": {}, "merch/19.0.x/19.0.002/rms/": {"merch/19.0.x/19.0.002/rms/rms19installer.zip": {}}}}}}

但是当我console.log在脚本标签中使用它时，输出是这样的：-

{"19.2.000/": {"19.2.000/dataconversion/": {}, "19.2.000/reim/": {}, "19.2.000/resa/": {}, "19.2.000/rms/": {}}, "19.2.001/": {"19.2.001/dataconversion/": {}}, "19.2/": {"19.2/alloc/": {}, "19.2/rpm/": {}}, "RESA/": {"RESA/folder1/": {}}, "RMS/": {}, "RPM/": {}, "/": {}, "apc/": {"apc/apc_inner/": {}}, "dataconversion/": {}, "folder2/": {}, "merch/": {"merch/19.0.x/": {"merch/19.0.x/19.0.000.1/": {"merch/19.0.x/19.0.000.1/dataconversion/": {}}, "merch/19.0.x/19.0.001/": {"merch/19.0.x/19.0.001/alloc/": {}, "merch/19.0.x/19.0.001/reim/": {}, "merch/19.0.x/19.0.001/resa/": {}, "merch/19.0.x/19.0.001/rms/": {"merch/19.0.x/19.0.001/rms/reports/": {}}, "merch/19.0.x/19.0.001/rpm/": {}}, "merch/19.0.x/19.0.002.1/": {"merch/19.0.x/19.0.002.1/Merged_RC/": {"merch/19.0.x/19.0.002.1/Merged_RC/rms/": {}}, "merch/19.0.x/19.0.002.1/hotfix/": {"merch/19.0.x/19.0.002.1/hotfix/rms/": {}}}, "merch/19.0.x/19.0.002/": {"merch/19.0.x/19.0.002/alloc/": {}, "merch/19.0.x/19.0.002/dataconversion/": {}, "merch/19.0.x/19.0.002/jos_merch/": {}, "merch/19.0.x/19.0.002/reim/": {}, "merch/19.0.x/19.0.002/resa/": {}, "merch/19.0.x/19.0.002/rms/": {"merch/19.0.x/19.0.002/rms/rms19installer.zip": {}}}}}}

其中"为每个添加"，显然它不是 javascript 可以处理的实际 JSON 格式。而且由于我将py_dict双引号内的 Django 变量 () 传递给变量，dict这本身也是一个问题，因为它变成了字符串变量，因此我无法对 Django 变量字典的元素执行任何操作py_dict

如何将其转换为正确的 javascript JSON 格式？

Answer 1

根据经验，永远不要在 javascript 中直接渲染 Django 中的任何内容。这可能会导致潜在的 XSS 攻击。如果您想要来自服务器的数据，请使用 AJAX（如果动态需要）或者您可以使用json_script模板过滤器 [Django 文档]（如果在页面加载时只需要一次）：

HTML 中的某处：

{{ py_dict|json_script:"py_dict" }}

这将呈现如下：

<script id="py_dict" type="application/json">JSON HERE</script>

接下来在 javascript 中你可以简单地使用：

var dict = JSON.parse(document.getElementById('py_dict').textContent);