Flask static files getting 404

Question

I am building a basic web app with following project structure. The app is fine but I am getting 404 errors for some of the static files.

I don't have any file like this bootstrap.css.map and not able to find enough docs related to this in flask.

127.0.0.1 - - [09/Feb/2014 22:37:17] "GET /static/css/bootstrap.css.map HTTP/1.1" 404 -

@app.route('/')
def index():
print 'in /'
return send_file('templates/login.html')

Directory structure:

app/
├── static/
│   └── bootstrap.min.css
├── templates/
│   └── index.html
└── app.py

EDIT: Here is my login html

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">

<title>API Test Application</title>

<!-- Bootstrap core CSS -->
<link href="/static/css/bootstrap.min.css" rel="stylesheet">

<!-- Custom CSS for the 'Thumbnail Gallery' Template -->
<link href="/static/css/2-col-portfolio.css" rel="stylesheet">
</head>

<body>
 ......simple login form..........
</body>
</html>

Can I ask why you are trying to use `send_file` with `templates/login.html`? Normally, your templates are returned by using [render_template()](http://flask.pocoo.org/docs/quickstart/#rendering-templates). Are you sure you actually want to return the template, as is, without rendering it? — Mark Hildreth, Feb 10 '14 at 14:54
@MarkHildreth, I don't have anything to render in that login.html. It is just a simple login form. I just want to return that file as is. Nothing to render in that. — San, Feb 11 '14 at 17:44
Just to confirm, you are not be able to get `/static/css/bootstrap.css.map`, everything is ok? If yes, then it is totally normal, `.map` is a source file that Chrome Dev Tool uses to map your minified file into its original file — Tan Nguyen, Feb 11 '14 at 17:50
yes, everything else is ok. I am able to get that login.html perfectly fine. Oh..and thanks for the tip about chrome dev tool. I just wanted to understand if there is any concept in flask I was missing because of this .map file like that. — San, Feb 11 '14 at 18:08
@San http://flask.pocoo.org/docs/quickstart/#static-files the quick start document have a section about serving static files. Though I know Flask's `url_for` function, yet I am too getting the error. — Allan Ruin, Mar 15 '14 at 13:01

score 13 · Accepted Answer · answered Mar 31 '14 at 18:06

13

Set _static_folder location against Flask.

app = Flask(__name__)
app._static_folder = <path to to your static directory>

answered Mar 31 '14 at 18:06

Bitmap

12,402
16
64
91

its probably better to use `app = Flask(__name__, static_folder=)` – user2682863 May 23 '20 at 21:18

score 2 · Answer 2 · edited May 23 '17 at 11:46

I've just had the same problem and eventually solved it like that:

https://stackoverflow.com/a/29521067/303114

Edit: Main parts that i did to solve it -

Project Structure:

enter image description here

server.py:

from server.AppStarter import AppStarter
import os

static_folder_root = os.path.join(os.path.dirname(os.path.abspath(__file__)), "client")

app = AppStarter()
app.register_routes_to_resources(static_folder_root)
app.run(__name__)

AppStarter.py:

from flask import Flask, send_from_directory
from flask_restful import Api, Resource
from server.ApiResources.TodoList import TodoList
from server.ApiResources.Todo import Todo


class AppStarter(Resource):
    def __init__(self):
        self._static_files_root_folder_path = ''  # Default is current folder
        self._app = Flask(__name__)  # , static_folder='client', static_url_path='')
        self._api = Api(self._app)

    def _register_static_server(self, static_files_root_folder_path):
        self._static_files_root_folder_path = static_files_root_folder_path
        self._app.add_url_rule('/<path:file_relative_path_to_root>', 'serve_page', self._serve_page, methods=['GET'])
        self._app.add_url_rule('/', 'index', self._goto_index, methods=['GET'])

    def register_routes_to_resources(self, static_files_root_folder_path):

        self._register_static_server(static_files_root_folder_path)
        self._api.add_resource(TodoList, '/todos')
        self._api.add_resource(Todo, '/todos/<todo_id>')

    def _goto_index(self):
        return self._serve_page("index.html")

    def _serve_page(self, file_relative_path_to_root):
        return send_from_directory(self._static_files_root_folder_path, file_relative_path_to_root)

    def run(self, module_name):
        if module_name == '__main__':
            self._app.run(debug=True)

i'm just trying this stuff out for the first time so you can check out my project progress on my repo in github: https://github.com/danfromisrael/TodoApp-Flask-Angular

Awesome! Exactly what I was looking for! Just run one file and serve an API as well as static files. :):):) — Erik van de Ven, Aug 10 '18 at 11:32

score 1 · Answer 3 · answered Apr 08 '20 at 11:02

1

I solved mine by adding the following;

app._static_folder = ''

below

app = Flask(__name__)

and you get

app = Flask(__name__)
app._static_folder = ''

answered Apr 08 '20 at 11:02

r3klaw

51
1
1
5

Felipe Vega · Answer 4 · 2023-02-25T22:23:15.670

0

below

app = Flask(__name__)

write

app._static_folder = 'templates/static'

(that's my route)

edited Feb 25 '23 at 22:23

answered Feb 25 '23 at 22:20

Felipe Vega

1
1

Flask static files getting 404

4 Answers4