Bagaimana untuk Menggunakan Data JSON yang Diberikan dengan Selamat daripada Templat Jinja dalam JavaScript?

JavaScript Meningkatkan SyntaxError dengan Data Diberikan dalam Templat Jinja

Isu:

Percubaan untuk menggunakan data JSON yang diberikan dalam Jinja templat dalam JavaScript gagal dengan "SyntaxError: Unexpected tanda '&'." kesilapan. Bagaimanakah data JSON yang diberikan ini boleh digunakan dengan berkesan dalam JavaScript?

Penyelesaian:

Persekitaran Jinja Flask sememangnya terlepas dari data yang diberikan dalam templat HTML untuk tujuan keselamatan. Apabila menghantar objek Python untuk ditafsirkan sebagai JSON, penapis tojson harus digunakan untuk menukar dan menandakan data dengan sewajarnya sebagai selamat:

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

var tree = {{ tree|tojson }};

Jika JSON tidak diberikan atau telah ditukar sebelum ini kepada rentetan, penapis selamat atau pembalut Markup boleh digunakan untuk memastikan selamat 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 }};

Sebagai alternatif, jika data digunakan dalam Jinja semata-mata dan tidak dihantar ke JavaScript, JSON tidak diperlukan. Data Python asal boleh dihantar dan digunakan terus dalam templat:

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

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

Atas ialah kandungan terperinci Bagaimana untuk Menggunakan Data JSON yang Diberikan dengan Selamat daripada Templat Jinja dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!