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

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

Susan Sarandon
发布: 2024-12-09 19:22:11
原创
646 人浏览过

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中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板