Jinja テンプレートと JSON データを使用するときに JavaScript の構文エラーを回避するにはどうすればよいですか?

JavaScript は、Jinja テンプレートでレンダリングされたデータで SyntaxError を発生させます

Flask の Jinja 環境は、セキュリティの問題を防ぐために、HTML テンプレートでレンダリングされたデータを自動的にエスケープします。 JSON として扱われる Python オブジェクトを渡す場合、JavaScript での構文エラーを避けるために、このエスケープを正しく処理することが重要です。

tojson フィルターの使用

Python オブジェクトを安全な JSON としてレンダリングするには、 tojson フィルター:

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

テンプレートでは、 use:

var tree = {{ tree|tojson }};

これにより、データが JSON に安全にダンプされ、エスケープを防ぐために安全であるとマークされます。

事前ダンプされた JSON の処理

JSON が既に文字列にダンプされた場合は、安全なフィルターを使用してレンダリングしても安全であるとマーク付けします:

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

Inテンプレートを使用するには:

var tree = {{ tree|safe }};

マークアップの使用

または、レンダリング前に文字列をマークアップでラップすることもできます:

return render_template('tree.html', tree=Markup(json.dumps(tree)))

テンプレートでは、次のように使用できます。値は次のとおりです:

var tree = {{ tree }};

Jinja の JSON の回避

を使用します。データを JavaScript に渡す代わりに Jinja で使用している場合は、tojson を使用しないでください。代わりに、Python データを直接渡して、通常のようにテンプレートで使用します:

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

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

以上がJinja テンプレートと JSON データを使用するときに JavaScript の構文エラーを回避するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。