Comment utiliser en toute sécurité les données JSON rendues à partir d'un modèle Jinja en JavaScript ?

JavaScript génère une erreur de syntaxe avec les données rendues dans un modèle Jinja

Problème :

Tentative d'utilisation des données JSON rendues dans un Jinja Le modèle dans JavaScript échoue avec une « Erreur de syntaxe : jeton inattendu '&'. » erreur. Comment ces données JSON rendues peuvent-elles être utilisées efficacement en JavaScript ?

Solution :

L'environnement Jinja de Flask échappe de manière inhérente aux données rendues dans les modèles HTML pour des raisons de sécurité. Lors du passage d'objets Python à interpréter comme JSON, le filtre tojson doit être utilisé pour convertir de manière appropriée et marquer les données comme sûres :

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

var tree = {{ tree|tojson }};

Si JSON n'est pas rendu ou a été précédemment converti en une chaîne, le filtre sécurisé ou le wrapper de balisage peut être utilisé pour garantir la sécurité rendu :

# 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 }};

Alternativement, si les données sont utilisées uniquement dans Jinja et ne sont pas transmises à JavaScript, JSON n'est pas requis. Les données Python originales peuvent être transmises et utilisées directement dans le modèle :

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

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

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!