首页 >web前端 >js教程 >解析 Jinja 渲染的 JSON 数据时如何解决 JavaScript 的语法错误?

解析 Jinja 渲染的 JSON 数据时如何解决 JavaScript 的语法错误?

Susan Sarandon
Susan Sarandon原创
2024-12-09 19:22:11700浏览

How to Resolve JavaScript's SyntaxError When Parsing Jinja-Rendered JSON Data?

JavaScript 在 Jinja 模板中渲染的数据引发语法错误

当尝试将 JSON 数据从 Flask 路由传递到 Jinja 模板并使用 JavaScript 对其进行迭代时,一个可能会遇到“SyntaxError: Unexpected token '&'”。当对渲染的数据调用 JSON.parse 时,会出现此错误。

问题

该问题源于 Flask 的 Jinja 环境,它会自动转义 HTML 模板中渲染的数据作为安全措施。当尝试在 JavaScript 中使用此转义数据作为 JSON 时,会出现语法错误。

解决方案:使用 tojson 过滤器

为了解决此问题,Flask 提供了 tojson 过滤器。此过滤器自动将 Python 数据转储为 JSON 并标记其可以安全地在 JavaScript 中渲染。

示例:

return render_template("tree.html", tree=tree)
var tree = {{ tree|tojson }};

替代解决方案

使用安全过滤器:

如果不渲染 JSON,可以使用安全过滤器来防止 Jinja 转义数据。

示例:

var tree = {{ tree|safe }};

使用Markup:

渲染前也可以将数据包装在Markup中,相当于使用安全过滤器。

示例:

var tree = {{ tree }};

将数据传递给 Jinja 而不是 JavaScript

如果数据不适合 JavaScript 使用但对于 Jinja 来说,不需要 tojson 过滤器。直接传递 Python 数据并将其用作模板中的任何其他数据。

示例:

return render_template("tree.html", tree=tree)
{% for item in tree %}
    <li>{{ item }}</li>
{% endfor %}

以上是解析 Jinja 渲染的 JSON 数据时如何解决 JavaScript 的语法错误?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn