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 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).

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) 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

--
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 django-rest-framework+unsub...@googlegroups.com.
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

[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