Wie behebe ich den SyntaxError von JavaScript beim Parsen von Jinja-gerenderten JSON-Daten?

JavaScript löst einen Syntaxfehler bei in der Jinja-Vorlage gerenderten Daten aus

Beim Versuch, Daten als JSON von einer Flask-Route an eine Jinja-Vorlage zu übergeben und mit JavaScript darüber zu iterieren, eine könnte auf einen „SyntaxError: Unerwartetes Token ‚&‘“ stoßen. Dieser Fehler tritt auf, wenn JSON.parse für die gerenderten Daten aufgerufen wird.

Problem

Das Problem rührt von der Jinja-Umgebung von Flask her, die aus Sicherheitsgründen automatisch in HTML-Vorlagen gerenderte Daten maskiert. Beim Versuch, diese maskierten Daten als JSON in JavaScript zu verwenden, treten Syntaxfehler auf.

Lösung: Verwendung des Tojson-Filters

Um dieses Problem zu beheben, stellt Flask den Tojson-Filter bereit. Dieser Filter speichert die Python-Daten automatisch in JSON und markiert sie als sicher für die Darstellung in JavaScript.

Beispiel:

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

var tree = {{ tree|tojson }};

Alternative Lösungen

Sicheren Filter verwenden:

Wenn JSON nicht gerendert wird, der sichere Filter kann verwendet werden, um zu verhindern, dass Jinja den Daten entkommt.

Beispiel:

var tree = {{ tree|safe }};

Markup verwenden:

The Daten können vor dem Rendern auch in Markup verpackt werden, was der Verwendung des Safes entspricht Filter.

Beispiel:

var tree = {{ tree }};

Übergabe von Daten an Jinja anstelle von JavaScript

Wenn die Daten nicht für die Verwendung von JavaScript, sondern für Jinja bestimmt sind , der Tojson-Filter ist nicht erforderlich. Übergeben Sie die Python-Daten direkt und verwenden Sie sie wie alle anderen Daten in der Vorlage.

Beispiel:

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

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

Das obige ist der detaillierte Inhalt vonWie behebe ich den SyntaxError von JavaScript beim Parsen von Jinja-gerenderten JSON-Daten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!