Status 404 on css files when deploying Django Rest Framework on Heroku

[Athanasios Garyfalos]

Hello everyone,

I am new to Django Rest Framework and to REST in general.

I followed the really nice REST-Tutorials
<http://www.django-rest-framework.org/tutorial/1-serialization/> and I
managed to make an API that on my local host is working perfectly.

My problem is when I am deploying it on the Heroku I get 404 error
regarding the Jana scripts css etc.

I following the logs with (heroku logs --tail --app myApi) and I see the
following:

2018-03-05T11:38:18.629896+00:00 app[web.1]: - 10.104.55.179 - -
[05/Mar/2018:12:38:18 +0100] "GET /static/rest_framework/js/default.js
HTTP/1.1" 404 109 "https://myApi.herokuapp.com/" "Mozilla/5.0 (X11; Linux
x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.186
Safari/537.36"
2018-03-05T11:38:18.690858+00:00 app[web.1]: - 10.104.55.179 - -
[05/Mar/2018:12:38:18 +0100] "GET /favicon.ico HTTP/1.1" 404 85
"https://myApi.herokuapp.com/" "Mozilla/5.0 (X11; Linux x86_64)
AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.186 Safari/537.36"
2018-03-05T11:38:18.692141+00:00 heroku[router]: - at=info method=GET
path="/favicon.ico" host=myApi.herokuapp.com
request_id=ec4d4ed0-19a9-4785-84b5-452e90239bfb fwd="5.59.34.149"
dyno=web.1 connect=1ms service=3ms status=404 bytes=260 protocol=https
2018-03-05T11:38:18.165004+00:00 heroku[router]: - at=info method=GET
path="/static/rest_framework/css/prettify.css" host=myApi.herokuapp.com
request_id=f9be6b23-eb9f-4efd-81e0-929772f0dac3 fwd="5.59.34.149"
dyno=web.1 connect=0ms service=2ms status=404 bytes=288 protocol=https
2018-03-05T11:38:18.205046+00:00 heroku[router]: - at=info method=GET
path="/static/rest_framework/js/prettify-min.js" host=myApi.herokuapp.com
request_id=385a1ec6-8951-4ac1-845a-757c600fff70 fwd="5.59.34.149"
dyno=web.1 connect=1ms service=3ms status=404 bytes=290 protocol=https

Sample of my tree structure:

$ tree -L 2 myApi/
myApi/
├── db.sqlite3
├── env
│ ├── bin
│ ├── include
│ ├── lib
│ ├── local
│ └── pip-selfcheck.json
├── manage.py
├── Pipfile
├── Pipfile.lock
├── Procfile
├── Procfile~
├── README.md
├── requirements.txt
├── snippets
│ ├── admin.py
│ ├── admin.pyc
│ ├── apps.py
│ ├── apps.pyc
│ ├── __init__.py
│ ├── __init__.pyc
│ ├── migrations
│ ├── models.py
│ ├── models.pyc
│ ├── permissions.py
│ ├── permissions.pyc
│ ├── serializers.py
│ ├── serializers.pyc
│ ├── tests.py
│ ├── urls.py
│ ├── urls.pyc
│ ├── views.py
│ └── views.pyc
└── myApi
├── __init__.py
├── __init__.pyc
├── settings.py
├── settings.pyc
├── static
├── urls.py
├── urls.pyc
├── wsgi.py
└── wsgi.pyc

9 directories, 34 files

I created my static file with the following command:

python manage.py collectstatic source: Managing static files (e.g. images,
JavaScript, CSS) <https://docs.djangoproject.com/en/2.0/howto/static-files/>
.

In my settings.py file I have:

# All settings common to all environments
PROJECT_ROOT = os.path.dirname(os.path.abspath(__file__))
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(PROJECT_ROOT, 'static')

I guess this correct configuration or at least this is what I found on line.

I can see the files in my Git repo but I can not understand why they are
not populated on the Heroku.

I guess this is a trivial question but if you do not have the knowledge on
the subject it can get very very difficult to find the solution.

Does any one had this problem before?

Thank you in advance for your time and effort reading and replying to my
question.

If you require any further information do not hesitate to come in contact
with me.

[Athanasios Garyfalos]

Hello again,

I guess this is a very common question on new Api(s) with Django Rest
Framework.

After spending 9 hours (just today the rest of the days do not count) I
finally managed to fixed it.

I followed the solution from here (django rest-framework : can't get static
files
<https://stackoverflow.com/questions/27012204/django-rest-framework-cant-get-static-files?rq=1>)
and I created in my settings this configurations:

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.9/howto/static-files/

PROJECT_ROOT = os.path.dirname(os.path.abspath(__file__))
STATIC_ROOT = os.path.join(PROJECT_ROOT, 'static')
STATIC_URL = '/static/'

STATICFILES_DIRS = (
("js", os.path.join(STATIC_ROOT, 'js')),
("css", os.path.join(STATIC_ROOT, 'css')),
("images", os.path.join(STATIC_ROOT, 'images')),
("fonts", os.path.join(STATIC_ROOT, 'fonts')),
)

I also needed to create the directory under my STATIC_ROOT but this is easy
after running the command:

python manage.py collectstatic

It will complain where the statics should be stored and if a directory does
not exist it will mention it.

I hope this will help someone else also in the future... :)

BR / Thanos

Post by Athanasios Garyfalos
Hello everyone,
I am new to Django Rest Framework and to REST in general.
I followed the really nice REST-Tutorials
<http://www.django-rest-framework.org/tutorial/1-serialization/> and I
managed to make an API that on my local host is working perfectly.
My problem is when I am deploying it on the Heroku I get 404 error
regarding the Jana scripts css etc.
I following the logs with (heroku logs --tail --app myApi) and I see the
2018-03-05T11:38:18.629896+00:00 app[web.1]: - 10.104.55.179 - -
[05/Mar/2018:12:38:18 +0100] "GET /static/rest_framework/js/default.js
HTTP/1.1" 404 109 "https://myApi.herokuapp.com/" "Mozilla/5.0 (X11; Linux
x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.186
Safari/537.36"
2018-03-05T11:38:18.690858+00:00 app[web.1]: - 10.104.55.179 - -
[05/Mar/2018:12:38:18 +0100] "GET /favicon.ico HTTP/1.1" 404 85 "
https://myApi.herokuapp.com/" "Mozilla/5.0 (X11; Linux x86_64)
AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.186 Safari/537.36"
2018-03-05T11:38:18.692141+00:00 heroku[router]: - at=info method=GET
path="/favicon.ico" host=myApi.herokuapp.com
request_id=ec4d4ed0-19a9-4785-84b5-452e90239bfb fwd="5.59.34.149"
dyno=web.1 connect=1ms service=3ms status=404 bytes=260 protocol=https
2018-03-05T11:38:18.165004+00:00 heroku[router]: - at=info method=GET
path="/static/rest_framework/css/prettify.css" host=myApi.herokuapp.com
request_id=f9be6b23-eb9f-4efd-81e0-929772f0dac3 fwd="5.59.34.149"
dyno=web.1 connect=0ms service=2ms status=404 bytes=288 protocol=https
2018-03-05T11:38:18.205046+00:00 heroku[router]: - at=info method=GET
path="/static/rest_framework/js/prettify-min.js" host=myApi.herokuapp.com
request_id=385a1ec6-8951-4ac1-845a-757c600fff70 fwd="5.59.34.149"
dyno=web.1 connect=1ms service=3ms status=404 bytes=290 protocol=https
$ tree -L 2 myApi/
myApi/
├── db.sqlite3
├── env
│ ├── bin
│ ├── include
│ ├── lib
│ ├── local
│ └── pip-selfcheck.json
├── manage.py
├── Pipfile
├── Pipfile.lock
├── Procfile
├── Procfile~
├── README.md
├── requirements.txt
├── snippets
│ ├── admin.py
│ ├── admin.pyc
│ ├── apps.py
│ ├── apps.pyc
│ ├── __init__.py
│ ├── __init__.pyc
│ ├── migrations
│ ├── models.py
│ ├── models.pyc
│ ├── permissions.py
│ ├── permissions.pyc
│ ├── serializers.py
│ ├── serializers.pyc
│ ├── tests.py
│ ├── urls.py
│ ├── urls.pyc
│ ├── views.py
│ └── views.pyc
└── myApi
├── __init__.py
├── __init__.pyc
├── settings.py
├── settings.pyc
├── static
├── urls.py
├── urls.pyc
├── wsgi.py
└── wsgi.pyc
9 directories, 34 files
python manage.py collectstatic source: Managing static files (e.g.
images, JavaScript, CSS)
<https://docs.djangoproject.com/en/2.0/howto/static-files/>.
# All settings common to all environments
PROJECT_ROOT = os.path.dirname(os.path.abspath(__file__))
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(PROJECT_ROOT, 'static')
I guess this correct configuration or at least this is what I found on line.
I can see the files in my Git repo but I can not understand why they are
not populated on the Heroku.
I guess this is a trivial question but if you do not have the knowledge on
the subject it can get very very difficult to find the solution.
Does any one had this problem before?
Thank you in advance for your time and effort reading and replying to my
question.
If you require any further information do not hesitate to come in contact
with me.
--
You received this message because you are subscribed to a topic in the
Google Groups "Django REST framework" group.
To unsubscribe from this topic, visit https://groups.google.com/d/
topic/django-rest-framework/Ecuuz17VJGE/unsubscribe.
To unsubscribe from this group and all its topics, send an email to
For more options, visit https://groups.google.com/d/optout.

[Alberto Luebbert M.]

Hello,

I have tried the same solution that you expose. And it just does not work.

The structure of my project is as follows:

| - db.sqlite3
| - Drive
| | - __init__.py
| | - __init __. pyc
| | - settings.py
| | - settings.pyc
| | - urls.py
| | - urls.pyc
| | - wsgi.py
| | - static
| `- wsgi.pyc
| - manage.py
`- users
| - admin.py
| - admin.pyc
| - apps.py
| - __init__.py
| - __init __. pyc
| - migrations
| | - __init__.py
| `- __init __. pyc
| - models.py
| - models.pyc
| - serializers.py
| - serializers.pyc
| - tests.py
| - urls.py
| - urls.pyc
| - views.py
`- views.pyc

and this is my in apache2:

<VirtualHost *: 80>
<Directory / home / ubuntu / demodjango / Drive>
<Files wsgi.py>
Require all granted
</ Files>
</ Directory>

WSGIDaemonProcess demodjango python-home = / home / ubuntu / developer
python-path = / home / ubuntu / demodjango / Drive
WSGIProcessGroup demodjango
WSGIScriptAlias ​​/ /home/ubuntu/demodjango/Drive/wsgi.py
</ VirtualHost>

I still have 404 errors. I wish you could give me a sign :)

Greetings from Mexico,
Alberto

Post by Athanasios Garyfalos
Hello again,
I guess this is a very common question on new Api(s) with Django Rest
Framework.
After spending 9 hours (just today the rest of the days do not count) I
finally managed to fixed it.
I followed the solution from here (django rest-framework : can't get
static files
<https://stackoverflow.com/questions/27012204/django-rest-framework-cant-get-static-files?rq=1>)
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.9/howto/static-files/
PROJECT_ROOT = os.path.dirname(os.path.abspath(__file__))
STATIC_ROOT = os.path.join(PROJECT_ROOT, 'static')
STATIC_URL = '/static/'
STATICFILES_DIRS = (
("js", os.path.join(STATIC_ROOT, 'js')),
("css", os.path.join(STATIC_ROOT, 'css')),
("images", os.path.join(STATIC_ROOT, 'images')),
("fonts", os.path.join(STATIC_ROOT, 'fonts')),
)
I also needed to create the directory under my STATIC_ROOT but this is
python manage.py collectstatic
It will complain where the statics should be stored and if a directory
does not exist it will mention it.
I hope this will help someone else also in the future... :)
BR / Thanos

Post by Athanasios Garyfalos
Hello everyone,
I am new to Django Rest Framework and to REST in general.
I followed the really nice REST-Tutorials
<http://www.django-rest-framework.org/tutorial/1-serialization/> and I
managed to make an API that on my local host is working perfectly.
My problem is when I am deploying it on the Heroku I get 404 error
regarding the Jana scripts css etc.
I following the logs with (heroku logs --tail --app myApi) and I see the
2018-03-05T11:38:18.629896+00:00 app[web.1]: - 10.104.55.179 - -
[05/Mar/2018:12:38:18 +0100] "GET /static/rest_framework/js/default.js
HTTP/1.1" 404 109 "https://myApi.herokuapp.com/" "Mozilla/5.0 (X11;
Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.186
Safari/537.36"
2018-03-05T11:38:18.690858+00:00 app[web.1]: - 10.104.55.179 - -
[05/Mar/2018:12:38:18 +0100] "GET /favicon.ico HTTP/1.1" 404 85 "
https://myApi.herokuapp.com/" "Mozilla/5.0 (X11; Linux x86_64)
AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.186 Safari/537.36"
2018-03-05T11:38:18.692141+00:00 heroku[router]: - at=info method=GET
path="/favicon.ico" host=myApi.herokuapp.com
request_id=ec4d4ed0-19a9-4785-84b5-452e90239bfb fwd="5.59.34.149"
dyno=web.1 connect=1ms service=3ms status=404 bytes=260 protocol=https
2018-03-05T11:38:18.165004+00:00 heroku[router]: - at=info method=GET
path="/static/rest_framework/css/prettify.css" host=myApi.herokuapp.com
request_id=f9be6b23-eb9f-4efd-81e0-929772f0dac3 fwd="5.59.34.149"
dyno=web.1 connect=0ms service=2ms status=404 bytes=288 protocol=https
2018-03-05T11:38:18.205046+00:00 heroku[router]: - at=info method=GET
path="/static/rest_framework/js/prettify-min.js" host=myApi.herokuapp.com
request_id=385a1ec6-8951-4ac1-845a-757c600fff70 fwd="5.59.34.149"
dyno=web.1 connect=1ms service=3ms status=404 bytes=290 protocol=https
$ tree -L 2 myApi/
myApi/
├── db.sqlite3
├── env
│ ├── bin
│ ├── include
│ ├── lib
│ ├── local
│ └── pip-selfcheck.json
├── manage.py
├── Pipfile
├── Pipfile.lock
├── Procfile
├── Procfile~
├── README.md
├── requirements.txt
├── snippets
│ ├── admin.py
│ ├── admin.pyc
│ ├── apps.py
│ ├── apps.pyc
│ ├── __init__.py
│ ├── __init__.pyc
│ ├── migrations
│ ├── models.py
│ ├── models.pyc
│ ├── permissions.py
│ ├── permissions.pyc
│ ├── serializers.py
│ ├── serializers.pyc
│ ├── tests.py
│ ├── urls.py
│ ├── urls.pyc
│ ├── views.py
│ └── views.pyc
└── myApi
├── __init__.py
├── __init__.pyc
├── settings.py
├── settings.pyc
├── static
├── urls.py
├── urls.pyc
├── wsgi.py
└── wsgi.pyc
9 directories, 34 files
python manage.py collectstatic source: Managing static files (e.g.
images, JavaScript, CSS)
<https://docs.djangoproject.com/en/2.0/howto/static-files/>.
# All settings common to all environments
PROJECT_ROOT = os.path.dirname(os.path.abspath(__file__))
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(PROJECT_ROOT, 'static')
I guess this correct configuration or at least this is what I found on line.
I can see the files in my Git repo but I can not understand why they are
not populated on the Heroku.
I guess this is a trivial question but if you do not have the knowledge
on the subject it can get very very difficult to find the solution.
Does any one had this problem before?
Thank you in advance for your time and effort reading and replying to my
question.
If you require any further information do not hesitate to come in contact
with me.
--
You received this message because you are subscribed to a topic in the
Google Groups "Django REST framework" group.
To unsubscribe from this topic, visit
https://groups.google.com/d/topic/django-rest-framework/Ecuuz17VJGE/unsubscribe
.
To unsubscribe from this group and all its topics, send an email to
For more options, visit https://groups.google.com/d/optout.

[Athanasios Garyfalos]

Hello Alberto,

It is not clear to me yet you get a 404 on Server or on client.

I mean, when you run the server do you see something like that?

System check identified no issues (0 silenced).
May 03, 2018 - 16:24:20
Django version 1.11.10, using settings 'thanosTest.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.

Looking forward to your reply.

Best Regards,
Thanos