PythonのWebフレームワークであるFlaskとJavaScriptを連携させる方法について解説します。
FlaskからJavaScriptへの値の渡し方
FlaskからJavaScriptへ値を渡す基本的な方法は、FlaskのテンプレートエンジンJinja2を利用することです。具体的には、以下のようなコードで実現できます。
@app.route('/')
def index():
text = "こちらFlaskスネーク。 応答せよ。"
return render_template('index.html', text=text)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>FlaskからJavaScriptに値を渡す</title>
</head>
<body>
<p>{{text}}</p><br>
<script>
var x = {{text|tojson}};
document.write("(" + x + ")" + " Roger こちらJavaScript。 Over。 ")
</script>
</body>
</html>
この例では、Pythonの変数textをJavaScriptの変数xに渡しています。{{text|tojson}}の部分で、Pythonの変数をJavaScriptに渡しています。tojsonフィルターを使用することで、PythonのデータをJavaScriptのオブジェクトに変換し、HTMLの特殊文字を安全にレンダリングできます。
JavaScriptからPythonへの値の渡し方
JavaScriptからPythonへ値を渡す方法もあります。具体的には、JavaScriptからAJAXリクエストを送信し、Flaskのルートでそのリクエストを受け取ることで実現できます。
以上、PythonのFlaskとJavaScriptを連携させる基本的な方法について解説しました。これらの知識を活用して、より動的なWebアプリケーションを作成してみてください。.