ホームページ > 記事 > ウェブフロントエンド > Flask からテンプレート内の JavaScript にデータを渡すにはどうすればよいですか?
Flask を使用する場合、JavaScript による操作のためにバックエンドからフロントエンドにデータを渡すことが必要になることがよくあります。これは、テンプレートのレンダリングを通じて実現できます。
Flask で使用される Jinja2 テンプレート エンジンを使用すると、テンプレート内で Python 変数に直接アクセスできます。 Python から JavaScript に変数を渡すには、変数を二重中括弧 {{ }} で囲むだけです。
<code class="html"><head> <script> var myVariable = '{{ my_python_variable }}'; </script> </head></code>
を渡す次のシナリオを考えてみましょう。テンプレート内の Google Maps API への地理座標の辞書:
<code class="python"># Assuming 'events' is a dictionary geocode = event['latitude'], event['longitude'] return render_template('my_template.html', geocode=geocode)</code>
このデータを JavaScript で利用できるようにするには、Jinja2 を使用できます:
<code class="html"><head> <script> var lat = '{{ geocode[0] }}'; var lng = '{{ geocode[1] }}'; </script> </head></code>
Jinja2 は、Python オブジェクトを JSON 文字列に変換する tojson フィルターを提供します。これは、JavaScript 変数に直接埋め込むことができます:
<code class="html"><script> var geocode = {{ geocode|tojson }}; </script></code>
以上がFlask からテンプレート内の JavaScript にデータを渡すにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。