的JavaScript提出的SyntaxError使用JSON在神社模板

我試圖從瓶路線到神社模板渲染JavaScript的傳遞數據的JSON呈現。我想用JavaScript來迭代數據。該瀏覽器顯示SyntaxError: Unexpected token '&'. Expected a property name.時JSON.parse被稱爲上所呈現的數據。我如何在JavaScript中使用呈現的JSON數據？的JavaScript提出的SyntaxError使用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'}]}]}

來源

2016-02-22 EspenG

瓶的神社環境自動轉義在HTML模板呈現的數據。這是爲了避免安全問題，如果開發人員嘗試渲染不可信用戶輸入。

由於您傳遞的Python對象被視爲JSON，因此Flask提供了tojson篩選器，該篩選器將數據自動轉儲爲JSON並將其標記爲安全。

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

var tree = {{ tree|tojson }};

當你只是看在HTML呈現的數據，它看起來正確的，因爲瀏覽器顯示轉義符號作爲真正的符號（雖然在這種情況下，你看到一個Python的字符串表示字典，而不是JSON，所以還有一些問題，如u標記）。

上一頁瓶的版本沒有標註轉儲的數據安全，所以你可能會遇到的例子一樣{{ tree|tojson|safe }}，這是因爲不再需要。

如果你沒有渲染JSON（或你已經傾倒的JSON爲字符串），你可以告訴神社的數據是安全的，不渲染，通過使用safe過濾器逃逸。

# already dumped to json, so tojson would double-encode it 
return render_template('tree.html', tree=json.dumps(tree))

var tree = {{ tree|safe }};

您也可以渲染之前包裹在字符串中Markup，它相當於safe過濾器。

# already dumped and marked safe 
return render_template('tree.html', tree=Markup(json.dumps(tree)))

var tree = {{ tree }};

來源

2016-02-22 15:38:57 davidism

我也強烈建議，'tojson'濾波器，*不*'json.dumps（）'，因爲後者仍然可以產生輸出實際上不是HTML安全。因此，直接將'tree' *傳遞給模板，然後使用'var tree = {{tree | tojson |安全}};'。 –

-3

的問題是，您的服務器不返回JSON，但呈現的HTML，它逃脫一些符號與符號&。

而不是使用

return render_template("folder.html", data=tree)

的嘗試

return flask.jsonify(**tree)

來源

2016-02-22 14:25:18

運算試圖呈現一個完整的頁面，包括該JSON數據，因此返回JSON響應並不能真正解決他們遇到的問題。此外，如果數據不是字典（直到Flask 1.0發佈），這將失敗。 – davidism

的JavaScript提出的SyntaxError使用JSON在神社模板

回答

相關問題