Jinja テンプレートからレンダリングされた JSON データを JavaScript で安全に使用するにはどうすればよいですか?

Jinja テンプレートでレンダリングされたデータで JavaScript が SyntaxError を発生させる

問題:

Jinja でレンダリングされた JSON データを利用しようとしましたJavaScript 内のテンプレートが「SyntaxError: Unexpected token」で失敗する「＆」。エラー。このレンダリングされた JSON データを JavaScript で効果的に使用するにはどうすればよいですか?

解決策:

Flask の Jinja 環境は、セキュリティ上の目的で HTML テンプレートでレンダリングされたデータを本質的にエスケープします。 JSON として解釈される Python オブジェクトを渡すときは、tojson フィルターを使用してデータを適切に変換し、安全であるとマークする必要があります。

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

var tree = {{ tree|tojson }};

JSON がレンダリングされていないか、以前に変換されている場合文字列、安全なフィルター、またはマークアップ ラッパーを利用して安全性を確保できます。 rendering:

# already dumped to json
return render_template('tree.html', tree=json.dumps(tree))

var tree = {{ tree|safe }};

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

var tree = {{ tree }};

あるいは、データが Jinja 内でのみ使用され、JavaScript に渡されない場合、JSON は必要ありません。元の Python データをテンプレートに直接渡して使用できます:

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

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

以上がJinja テンプレートからレンダリングされた JSON データを JavaScript で安全に使用するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。