外部JavaScriptでPython Flaskでパラメータを渡す

私は自分のウェブサイトにPython Flaskを使用しており、いくつかのパラメータをJavascriptに渡します。これは私のコードです：外部JavaScriptでPython Flaskでパラメータを渡す

from flask import Flask 
from flask import render_template 

app = Flask(__name__) 


@app.route("/") 
def index(): 

    return render_template("index.html", param1="Hello") 


<html> 
    <head> 
    </head> 
    <body> 
     <p>Hello World</p> 
    </body> 
    <script>console.log({{param1}})</script> 
</html>

このようにすれば、問題なく動作します。この例は私自身の単純化されたものです。しかし、私は外部ファイルでスクリプトを持っており、このようにそれを呼び出すようにしたい場合：

<html> 
    <head> 
    </head> 
    <body> 
     <p>Hello World</p> 
    </body> 
    <script src="/static/js/myjs.js"></script> 
</html>

そしてmyjs.jsファイルがconsole.log({{param1}})であることは、それは動作しません。だから、Python Flaskで外部のJavascriptファイルにパラメータを渡す方法はありますか？

出典

2015-01-13 Tasos

スクリプトはテンプレートディレクトリ内にある必要があります – Hackaholic

私は静的テンプレートと2）テンプレートの2つのフォルダを持っています。静的フォルダには、css、js、および画像があります。 jsファイルijnテンプレートを動かせるようにする必要がありますか？ – Tasos

Jinjaでファイルをレンダリングする場合は、render_templateに電話をかけて、必要な値を渡す必要があります。静的なファイルに直接リンクするだけでは、明らかにそのようにはなりません。 1つの解決方法は、Jinjaのincludeブロックを使用することです。これには、 'myjs.js'が 'templates/js'フォルダにあり、レンダリングされたテンプレートに含まれ、すべてのテンプレートコンテキストがインクルードされたテンプレートに渡されます。

<script>{% include 'js/myjs.js' %}</script>

より良いソリューションは、リクエストごとにJSをレンダリングし、代わりにあなたのテンプレートからJSの関数にパラメータを渡す必要がないことです。

<script src="{{ url_for('static', filename='js/myjs.js') }}"></script> 
<script> 
    my_func({{ my_var|tojson }}); 
</script>

出典

2015-01-13 15:56:57 davidism

私は、HTMLページで指定されたJavaScriptファイルをロードする別の方法を使用：

はまず、私は<head></head>タグ内のいくつかの変数を定義し、私は私のjavascriptファイルを呼び出す：

<head> 
... 
<script src="/static/js/jquery.js"></script> 
<script type=text/javascript> 
    $(document).ready(function() { 
     $link_subcat = "{{ url_for('load_subcategories') }}"; 
     $link_cat = "{{ url_for('load_categories') }}"; 
    }); 
</script> 

    <script src="{{ url_for('static', filename='finances.js') }}"></script>

を

...

これは私のjavascriptのファイルの内容です： $（ドキュメント）.ready（関数（）{

 $("#category").change(function() { 
      $.ajax({ 
       type: "POST", 
       url: $link_subcat, 
       data: {cat: $(this).val()}, 
       success: function(data) { 
        $("#subcategory").html(data); 
       } 
      }); 
     }); 

     $("input[name=type]").change(function() { 
      $.ajax({ 
       type: "POST", 
       url: $link_cat, 
       data: {type: $('input[name="type"]:checked').val()}, 
       success: function(data) { 
        $("#category").html(data); 
       } 
      }); 
     }); 

    });

このアプローチは私には役に立ちます。

出典

2016-10-17 23:49:59

外部JavaScriptでPython Flaskでパラメータを渡す

答えて

関連する問題