😎
flask：JSONデータを綺麗に整形したいとき
テンプレート構文：tojson
- flaskは，jinjaと呼ばれるテンプレート構文を採用している．
- flaskでjsonデータを扱う際，
tojsonと呼ばれるフィルターを使用する． - tojsonは，引数でインデントの指定が可能である．
{{json_data|tojson(indent=2)}}
python標準ライブラリ：json
- python標準ライブラリのjsonでもインデントの指定等ができる．
※flaskのjsonメソッドは，デフォルトではこの標準ライブラリを使用しているので説明は省略．
バイトデータを含む場合(JWT等）：pprint.pformat
- ここでは，バイトデータを含むjsonの例としてjwtを挙げる．
- バイトデータを含むdictおよびjsonデータを，pythonでの
json.dumps(・・・）やテンプレート構文での{{json_data|tojson}}を行うと，下記のようなエラーが起こる．
Object of type bytes is not JSON serializable
- signatureも含めて整形されたJWTデータを表示させたい場合，pythonモジュールの
pprintを用いてhtml側に渡すのが良い．
pythonファイル
import pprint
# ・・・
def get_pretty_format_jwt(jwt):
reformatted_jwt = {
'header': jwt['header'],
'payload': jwt['payload'],
'signature': jwt['signature']
}
return pprint.pformat(reformatted_jwt,indent=0,width=120,sort_dicts=False)
# ・・・
formatted_jwt = get_pretty_format_jwt(jwt)
そして，htmlファイルにpythonの値を渡して，表示するときの処理は下記のようにする．
- python側
pythonファイル
return render_template(・・・, formatted_jwt=formatted_jwt, ・・・)
- html側
htmlファイル
<div class="json-container">
<pre>
{{ formatted_jwt }}
</pre>
</div>
- css側
style.css
.json-container {
font-family: monospace; /* 等幅フォント */
white-space: pre; /* 改行を保持 */
background-color: #f8f8f8; /* 背景色 */
padding: 10px; /* パディング */
border: 1px solid #ccc; /* 境界 */
border-radius: 4px; /* 角を丸く */
overflow-x: auto; /* 横スクロールを許可 */
}
参考資料
json
flask
jinja
pprint
Discussion