Posted inPython

Python 3 – Flask静的ファイル（例）-Pythonチュートリアル

January 4, 2021No Comments

Webアプリケーションでは、多くの場合、Web表示をサポートするJavaScriptファイルやCSSファイルなどの静的ファイルが必要です。

通常、Webサーバーを構成すると、これが提供されます。 ただし、開発中のFlask開発中、PythonはすべてのWebリクエストを解析します。

これを解決するために、これらのファイルは静的フォルダーに配置され、アプリケーションの /static。

関連コース： Python Flask：Flaskを使用してWebアプリを作成する

静的ファイル

静的ファイルを配置する場所

特別なエンドポイントのURL static 静的ファイルを生成するために使用されます。 プログラムディレクトリに、staticという名前の新しいディレクトリを作成します。

このディレクトリには、画像、javascriptファイル、cssファイル、およびPythonバックエンドを必要としない他の多くのファイルを配置できます。

例

次の例では、hello.jsで定義されたjavascript関数が、Flaskアプリケーションの「/」URLにレンダリングされるindex.htmlのHTMLボタンのOnClickイベントで呼び出されます。

1
2
3
4
5
6
7
8
9
 
from flask import Flask, render_template
app = Flask(__name__)

@app.route("https://pythonbasics.org/")
def index():
   return render_template("index.html")

if __name__ == '__main__':
   app.run(debug = True)

次にindex.html

1
2
3
4
5
6
7
8
9
10
11
12
 
<html>

   <head>
      <script type = "text/javascript" 
         src = "{{ url_for('static', filename="hello.js") }}" ></script>
   </head>
   
   <body>
      <input type = "button" onclick = "sayHello()" value = "Say Hello" />
   </body>
   
</html>

javascriptファイルhello.jsを追加します

1
2
3
 
function sayHello() {
   alert("Hello World")
}

関連コース： Python Flask：Flaskを使用してWebアプリを作成する

Hope this helps!

Source link

Tags: