Flask Static Files

Web applications usually require a static file, such as a JavaScript file or CSS file to support displaying web pages. Usually, these services can be provided by configuring the web server, but during the development process, these files will be provided from the static folder or module adjacent to the package, which will be in the application's/Provided on 'static'.

Use the special endpoint 'static' to generate URLs for static files.

In the following example, the OnClick event of the HTML button in index.html calls the JavaScript function defined in hello.js, which is in the Flask application's URL => / is presented.

Example

# Filename : example.py
# Copyright :　2020 By w3codebox
# Author by : www.oldtoolbag.com
# Date :　2020-08-08
from flask import Flask, render_template
　app = Flask(__name__)
　@app.route("/)
　def index():
　　　　　return render_template("index.html")
　if __name__ == '__main__':
　　　　　app.run(debug = True)

index.html The HTML script in the following example is as follows.

# Filename : example.py
# Copyright :　2020 By w3codebox
# Author by : www.oldtoolbag.com
# Date :　2020-08-08
<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>

File: hello.js defined in the file containing the sayHello() function.

# Filename : example.py
# Copyright :　2020 By w3codebox
# Author by : www.oldtoolbag.com
# Date :　2020-08-08
function sayHello() {
　　　　alert("Hello World")
　}

Flask Request Object Flask Templates

Flask Tutorial

Flask Static Files