从 Jinja 模板渲染 JSON 数据时，为什么 JSON.parse 会失败并出现'SyntaxError: Unexpected token '&'”？

从 Jinja 模板渲染 JSON 数据时出现 JavaScript 语法错误

问题描述

当尝试使用 JavaScript 迭代 Jinja 模板中渲染的 JSON 数据时，浏览器抛出“SyntaxError: Unexpected token '&'”错误。对渲染的数据调用 JSON.parse 时会出现此问题。

解决方案

Flask 的模板转义

Flask 的 Jinja 环境对模板中渲染的数据应用自动 HTML 转义以降低安全性风险。但是，这种转义可能会干扰将数据解释为 JSON。

Flask 提供了 tojson 过滤器来解决此问题。它将 Python 对象转换为 JSON 并将其标记为安全渲染。

return render_template('tree.html', tree=tree)

在模板中：

var tree = {{ tree|tojson }};

非 JSON 渲染

如果数据是不适合 JavaScript 使用，因此不需要 tojson 过滤器。考虑直接传递 Python 数据并根据需要在模板中使用它。

return render_template('tree.html', tree=tree)

在模板中：

{% for item in tree %}
    <li>{{ item }}</li>
{% endfor %}

禁用转义

如果不需要转义并且您已经将 JSON 数据作为字符串，您可以使用安全过滤器禁用转义或标记。

使用安全过滤器：

return render_template('tree.html', tree=Markup(json.dumps(tree)))

在模板中：

var tree = {{ tree }};

使用标记：

return render_template('tree.html', tree=json.dumps(tree))

在模板：

var tree = {{ tree|safe }};

以上是从 Jinja 模板渲染 JSON 数据时，为什么 JSON.parse 会失败并出现'SyntaxError: Unexpected token '&'”？的详细内容。更多信息请关注PHP中文网其他相关文章！