搜尋
首頁後端開發Python教學如何在 JavaScript 中安全地使用從 Jinja 模板渲染的 JSON 資料?

How to Safely Use JSON Data Rendered from a Jinja Template in JavaScript?

JavaScript 對Jinja 模板中渲染的資料引發語法錯誤

問題:

嘗試利用Jinja資料JavaScript 中的範本失敗並顯示「SyntaxError: Unexpected token '&'」。錯誤。如何在 JavaScript 中有效地使用渲染的 JSON 資料?

解決方案:

出於安全目的,Flask 的 Jinja 環境本質上會對 HTML 模板中渲染的資料進行轉義。當傳遞要解釋為 JSON 的 Python 物件時,應使用 tojson 過濾器來適當地轉換資料並將資料標記為安全性:

return render_template('tree.html', tree=tree)
var tree = {{ tree|tojson }};

如果 JSON未渲​​染或之前已轉換為字串,可以使用安全過濾器或標記包裝器來確保安全渲染:

# 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 %}
    
  • {{ item }}
  • {% endfor %}

    以上是如何在 JavaScript 中安全地使用從 Jinja 模板渲染的 JSON 資料?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

    陳述
    本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
    Python中的合併列表:選擇正確的方法Python中的合併列表:選擇正確的方法May 14, 2025 am 12:11 AM

    Tomergelistsinpython,YouCanusethe操作員,estextMethod,ListComprehension,Oritertools

    如何在Python 3中加入兩個列表?如何在Python 3中加入兩個列表?May 14, 2025 am 12:09 AM

    在Python3中,可以通過多種方法連接兩個列表:1)使用 運算符,適用於小列表,但對大列表效率低;2)使用extend方法,適用於大列表,內存效率高,但會修改原列表;3)使用*運算符,適用於合併多個列表,不修改原列表;4)使用itertools.chain,適用於大數據集,內存效率高。

    Python串聯列表字符串Python串聯列表字符串May 14, 2025 am 12:08 AM

    使用join()方法是Python中從列表連接字符串最有效的方法。 1)使用join()方法高效且易讀。 2)循環使用 運算符對大列表效率低。 3)列表推導式與join()結合適用於需要轉換的場景。 4)reduce()方法適用於其他類型歸約,但對字符串連接效率低。完整句子結束。

    Python執行,那是什麼?Python執行,那是什麼?May 14, 2025 am 12:06 AM

    pythonexecutionistheprocessoftransformingpypythoncodeintoExecutablestructions.1)InternterPreterReadSthecode,ConvertingTingitIntObyTecode,whepythonvirtualmachine(pvm)theglobalinterpreterpreterpreterpreterlock(gil)the thepythonvirtualmachine(pvm)

    Python:關鍵功能是什麼Python:關鍵功能是什麼May 14, 2025 am 12:02 AM

    Python的關鍵特性包括:1.語法簡潔易懂,適合初學者;2.動態類型系統,提高開發速度;3.豐富的標準庫,支持多種任務;4.強大的社區和生態系統,提供廣泛支持;5.解釋性,適合腳本和快速原型開發;6.多範式支持,適用於各種編程風格。

    Python:編譯器還是解釋器?Python:編譯器還是解釋器?May 13, 2025 am 12:10 AM

    Python是解釋型語言,但也包含編譯過程。 1)Python代碼先編譯成字節碼。 2)字節碼由Python虛擬機解釋執行。 3)這種混合機制使Python既靈活又高效,但執行速度不如完全編譯型語言。

    python用於循環與循環時:何時使用哪個?python用於循環與循環時:何時使用哪個?May 13, 2025 am 12:07 AM

    UseeAforloopWheniteratingOveraseQuenceOrforAspecificnumberoftimes; useAwhiLeLoopWhenconTinuingUntilAcIntiment.forloopsareIdealForkNownsences,而WhileLeleLeleLeleLeleLoopSituationSituationsItuationsItuationSuationSituationswithUndEtermentersitations。

    Python循環:最常見的錯誤Python循環:最常見的錯誤May 13, 2025 am 12:07 AM

    pythonloopscanleadtoerrorslikeinfiniteloops,modifyingListsDuringteritation,逐個偏置,零indexingissues,andnestedloopineflinefficiencies

    See all articles

    熱AI工具

    Undresser.AI Undress

    Undresser.AI Undress

    人工智慧驅動的應用程序,用於創建逼真的裸體照片

    AI Clothes Remover

    AI Clothes Remover

    用於從照片中去除衣服的線上人工智慧工具。

    Undress AI Tool

    Undress AI Tool

    免費脫衣圖片

    Clothoff.io

    Clothoff.io

    AI脫衣器

    Video Face Swap

    Video Face Swap

    使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

    熱門文章

    熱工具

    SublimeText3漢化版

    SublimeText3漢化版

    中文版,非常好用

    WebStorm Mac版

    WebStorm Mac版

    好用的JavaScript開發工具

    禪工作室 13.0.1

    禪工作室 13.0.1

    強大的PHP整合開發環境

    SublimeText3 Linux新版

    SublimeText3 Linux新版

    SublimeText3 Linux最新版

    Dreamweaver CS6

    Dreamweaver CS6

    視覺化網頁開發工具