JavaScript在Jinja模板中引发JSON渲染SyntaxError
我试图从一个Flask路由传递数据作为JSON到Jinja模板渲染JavaScript。 我想用JavaScript来迭代数据。 浏览器显示SyntaxError: Unexpected token '&'. Expected a property name.
SyntaxError: Unexpected token '&'. Expected a property name.
当在呈现的数据上调用JSON.parse
时。 如何在JavaScript中使用呈现的JSON数据?
var obj = JSON.parse({{ data }}) for (i in obj){ document.write(obj[i].text + "<br />"); }
def get_nodes(node): d = {} if node == "Root": d["text"] = node else: d["text"] = node.name getchildren = get_children(node) if getchildren: d["nodes"] = [get_nodes(child) for child in getchildren] return d tree = get_nodes("Root") return render_template("folder.html", data=tree)
如果我只是把{{ data }}
放在HTML部分,我看到的是正确的。
{'text': 'Root', 'nodes': [{'text': u'Prosjekt3'}, {'text': u'Prosjekt4', 'nodes': [{'text': u'mappe8'}]}]}
Flask的Jinja环境会自动转义HTML模板中呈现的数据。 这是为了避免安全问题,如果开发人员尝试渲染不可信用户input。
由于您传递的Python对象被视为JSON,因此Flask提供了tojson
filter,它自动将数据转储为JSON并将其标记为安全。
return render_template('tree.html', tree=tree)
var tree = {{ tree|tojson }};
当你只是看HTML中呈现的数据时,它看起来是正确的,因为浏览器将转义的符号显示为真正的符号(虽然在这种情况下,你看到的是Python字典的string表示,而不是JSON,所以仍然存在一些问题像u
标记)。
以前的Flask版本没有标记转储的数据安全,所以你可能会遇到像{{ tree|tojson|safe }}
这样的{{ tree|tojson|safe }}
,这是不再需要的。
如果您不渲染JSON(或者已经将JSON转储为string),则可以通过使用safe
筛选器告诉Jinja数据是否安全呈现,而不会转义。
# already dumped to json, so tojson would double-encode it return render_template('tree.html', tree=json.dumps(tree))
var tree = {{ tree|safe }};
在渲染之前,您也可以在Markup
包装string,这相当于safe
filter。
# already dumped and marked safe return render_template('tree.html', tree=Markup(json.dumps(tree)))
var tree = {{ tree }};
问题是你的服务器返回的不是JSON,而是呈现HTML,它用&符号转义了一些符号。
而不是使用
return render_template("folder.html", data=tree)
尝试
return flask.jsonify(**tree)