将 Python Flask JSON 字典导入 javascript 错误

Question

我有一个 Python Flask Web 应用程序，我想将其中的字典数据集传递给 javascript，我正在尝试 JSON 我可以很好地传递数字，但是在使用字符串时似乎会引发错误。

这是生成 JSON 字符串的 python 代码片段：view.py

def dumpdata():
DB_name={"name":"aaragh"}  
strng=json.dumps(DB_name)
return render_template('dumpdata.html',result = strng)

这是接收 HTML 文件 dumpdata.html

<html><body>
<p >{{ result }}</a>
<script>
var data = JSON.parse({{result}});
console.log(data.name);
</script>
</body></html>

这是错误消息和控制台输出：consolelog

语法错误：无效的属性 id dumpdata:4

<html><body>
<p >{&#34;name&#34;: &#34;aaragh&#34;}</a>
<script>
var data = JSON.parse({&#34;name&#34;: &#34;aaragh&#34;});
console.log(data.name);
</script>
</body></html>

我认为这无关紧要，但我在 ubuntu chrome 和 win IE 上都遇到了相同的错误。

有任何想法吗？ 我想我遗漏了一些明显的东西，但我已经为此头痛了好几天，但我仍然无法找到解决方案......

谢谢

Answer 1

看看模板过滤器|safe ：

<html><body>
<p >{{ result|safe }}</a>
<script>
var data = JSON.parse({{ result|safe }});
console.log(data.name);
</script>
</body></html>

Flask 文档提到
Jinja 文档提到

Answer 2

var data = JSON.parse({{ result|safe }});

这一行应该改为

var data = JSON.parse('{{ result|safe }}');

PS：如果没有引号，它对我不起作用。 我也在某处读到它在javascript中所有{{变量}}只能在引号内访问。

Answer 3

什么对我有用，用 Python 翻译字典并将其传递给 Javascript 以使用...

<script>
  {# passing diffData to javascript in the page template #}

  let diffData = {{ diffData | tojson | safe }};
  console.log(diffData);

  ...the rest of the code...
</script>

所以我不得不将diffData字典传递给模板，并用 Javascript 解析字典以特定格式显示结果。

我试过let diffData = JSON.parse({{ diffData | safe }}); 带和不带引号，两种类型，但 Chromium 不断抛出错误，如：

SyntaxError: Unexpected token o in JSON at position 1
SyntaxError: Unexpected token ' in JSON at position 1
SyntaxError: missing ) after argument list

值得注意的是，我在字典中使用单引号，例如：

{'2019-10-08 11:21': {'2019-10-08': {'KSML': {...

希望这对那里的一些人有所帮助。

干杯!

将 Python Flask JSON 字典导入 javascript 错误

问题描述

3 个解决方案

解决方案1
8 已采纳 2014-11-17 22:25:38

解决方案2
2 2018-08-16 10:29:27

解决方案3
0 2021-03-11 12:41:38

将 Python Flask JSON 字典导入 javascript 错误

问题描述

3 个解决方案

解决方案1 8 已采纳 2014-11-17 22:25:38

解决方案2 2 2018-08-16 10:29:27

解决方案3 0 2021-03-11 12:41:38

解决方案1
8 已采纳 2014-11-17 22:25:38

解决方案2
2 2018-08-16 10:29:27

解决方案3
0 2021-03-11 12:41:38