I always get 404 error in loading static files in an EC2 instance. I have searched for hours and tried to implement various suggestions but nothing worked.
Following is my configuration of different files:
settings.py
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
LOGIN_REDIRECT_URL = '/'
html
{% extends "base.html" %}
{% load staticfiles %}
{% block extra_head %}
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.css">
<script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.js"></script>
<script src="{% static "ddv_example/ddv_example_1_10.js" %}"></script>
<script type="text/javascript">
nginx.conf
location /static/admin {
alias /usr/local/virtualenvs/mysite/lib/python2.7/site-packages/django/contrib/admin/static/admin;
}
location /static/rest_framework {
alias /usr/local/virtualenvs/mysite/lib/python2.7/site-packages/rest_framework/static/rest_framework;
}
location /static {
alias /usr/local/apps/mysite/src/mysite/mysite/static;
}
location /static/ddv_example {
alias /usr/local/apps/mysite/src/mysite/mysite/static/ddv_example;
}
Any suggestions on what am i missing out ?
I had missed out re-running sudo ./server_setup.sh. The nginx configs will take effect only when the script is re-run.
Related
<script src="./home/static/js/2.d754fc32.chunk.js"></script>
Currently my html file points to this. What static variable django setting.py do I declare to make the HTML point to
<script src="./home/static/static/js/2.d754fc32.chunk.js"></script>
currently in setting.py
STATICFILES_DIRS = [
os.path.join(BASE_DIR, '../frontend/build')
]
STATIC_ROOT = '/var/www/web/home/static/'
STATIC_URL = 'home/static/'
My build folder contains a static file inside as well.
if STATICFILES_DIR is in the right place:
You just have to {% load 'static' %} on the top of your html (after extend), and to set the css file:
<link rel="stylesheet" type="text/css" href="{% static '/style.css' %}">
if you want a img from there would be:
<img src="{% static '<PathOfImage>/img.png' %}">
settings.py
STATIC_URL = '/static/'
STATICFILES_DIR = [
os.path.join(BASE_DIR, 'static_in_env')
]
STATIC_ROOT = os.path.join(BASE_DIR, 'static_root')
MEDIA_ROOT = os.path.join(BASE_DIR, 'media_root')
MEDIA_URL = '/media/'
django.contrib.staticfiles' included in installed_apps. {% load static from staticfiles %} used in base.html.
still getting these errors:
[22/Dec/2019 13:45:31] "GET / HTTP/1.1" 200 10735
[22/Dec/2019 13:45:32] "GET /static/js/jquery-3.4.1.min.js HTTP/1.1" 404
1791
[22/Dec/2019 13:45:43] "GET /static/css/bootstrap.min.css HTTP/1.1" 404
1788
[22/Dec/2019 13:45:43] "GET /static/css/mdb.min.css HTTP/1.1" 404 1770
......
script.html
{% load static from staticfiles %}
<script type="text/javascript" src="{% static 'js/jquery-3.4.1.min.js'
%}">
</script>
<!-- Bootstrap tooltips -->
<script type="text/javascript" src="{% static 'js/popper.min.js' %}">
</script>
<!-- Bootstrap core JavaScript -->
<script type="text/javascript" src="{% static 'js/bootstrap.min.js' %}">
</script>
<!-- MDB core JavaScript -->
<script type="text/javascript" src="{% static 'js/mdb.min.js' %}">
</script>
<!-- Initializations -->
<script type="text/javascript">
// Animations initialization
new WOW().init();
</script>
staticfiles dir includes following files and folders
static_in_env
- css
-bootstrap.css
-bootstrap.min.css
-mdb.css
-mdb.min.css
-mdb.lite.css
-mdb.lite.min.css
-style.css
-style.min.css
- font
- img
- js
-bootstrap.js
-bootstrap.min.js
-mdb.js
-mdb.min.js
-popper.min.js
- scss
In your project_name/urls.py, try to add the following at the end:
urlpatterns = [
# your urls...
]
# ↓ add this ↓
if settings.DEBUG:
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
Also, just put {% load static %} in your script.html, not {% load static from staticfiles %}
In settings.py add
STATIC_ROOT = os.path.join(BASE_DIR, 'static/')
STATIC_URL = '/static/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media/')
MEDIA_URL = '/media/'
In base.html
{% load static %}
Hopefully it will work if it doesn't run this command
Python manage.py collectstatic
if you are using bootstap, either you download it or use cdn
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
or you can use the starter template provided by bootstrap, which will have all the basic html,css and js files. Link: https://getbootstrap.com/docs/4.4/getting-started/introduction/
custom css links can be linked to the file as follows
<link rel="stylesheet" type="text/css" href="{% static 'css/custom.css' %}"/>
I am pretty new to Django and I am trying to put static files in my site but I am unable to do so. I am getting 404 when the browser tries to GET my static files
I'm not sure of the best practices or the correct way for Django to find these static files
Here is a picture of my project structure:
Here is my settings.py:
STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(BASE_DIR, "static"),
)
In my index.html I have a line:
<link href="{{ STATIC_URL }}boothie.css" rel="stylesheet">
<script src="{{ STATIC_URL }}boothie.js"></script>
<script src="{{ STATIC_URL }}jquery.js.1.3.js"></script>
I think this would work:
{% load staticfiles %}
<link href="{% static "css/boothie.css" %}" rel="stylesheet">
<script src="{% static "js/boothie.js" %}"></script>
<script src="{% static "js/jquery.js.1.3.js" %}"></script>
See: Configuring static files
Edit:
You can maintain static files which belong to your home app with the structure like this:
home/
static/
css/
images/
js/
While deploying, you can set STATIC_ROOT to where you want to serve these static files, then run python manage.py collectstatic, django will copy your static files into the STATIC_ROOT directory and you can maintain static files easier (in a single directory) without changing your code.
static_url will give the relative path ....
You may have to include
<link href="{% static "css/boothie.css" %}" rel="stylesheet">
it's my very beginning with the django. I've configured server with nginx and gunicorn. The problem is that static files are not being loaded correctly.
When I go to the source code I can see, f.e:
<link href="/app_name/static/css/bootstrap.min.css" rel="stylesheet">
although the correct file is located under: /static/css/bootstrap.min.css
So it seems that "app_name" is added before path to my /static/ folder.
settings.py file:
STATIC_ROOT = '/webapps/filmyposlowie/static/'
STATIC_URL = '/static/'
index.html file:
{% load staticfiles %}
<link href="{% static "css/bootstrap.min.css" %}" rel="stylesheet">
nginx:
location /static/ {
alias /webapps/filmyposlowie/static/;
}
Restarting the server after changing setting.py file has helped me. In my case it was: supervisorctl restart [process_name]
Do you have a STATICFILES_STORAGE setting in settings.py?
If not, try changing {% load staticfiles %} to {% load static %} in your index.html file. I had a similar problem once.
I'm having trouble serving static files on my development server. I have it configured as follows. This is in my settings.py file:
STATIC_URL = '/static/'
if socket.gethostname() == 'production_server':
STATIC_ROOT = "/var/www/html/static/"
else:
STATIC_ROOT = os.path.join(PROJECT_DIR, 'static')
I find a couple things curious about this:
Everything works fine on the production server.
On the development server, I get 404 errors for my own files but not the admin files...
http://localhost:8000/static/media/default.cssFailed to load resource: the server responded with a status of 404 (NOT FOUND)
http://localhost:8000/static/media/javascript/pipe.jsFailed to load resource: the server responded with a status of 404 (NOT FOUND)
http://localhost:8000/static/media/javascript/imdb_form.jsFailed to load resource: the server responded with a status of 404 (NOT FOUND)
http://localhost:8000/static/media/pipe-img/wb-mpi-logo.pngFailed to load resource: the server responded with a status of 404 (NOT FOUND)
http://localhost:8000/static/media/pipe-img/wb-mpi-logo-large.pngFailed to load resource: the server responded with a status of 404 (NOT FOUND)
...from this template...
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}media/default.css" media="screen"/>
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}admin/css/forms.css" />
<link rel="shortcut icon" href="{{ STATIC_URL }}media/pipe-img/favicon.ico" type="image/x-icon" />
<link rel="icon" href="{{ STATIC_URL }}media/pipe-img/favicon.ico" type="image/x-icon">
<script type="text/javascript" src="{% url 'django.views.i18n.javascript_catalog' %}"></script>
<script type="text/javascript" src="{{ STATIC_URL }}admin/js/core.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}admin/js/admin/RelatedObjectLookups.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}admin/js/jquery.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}admin/js/jquery.init.js"></script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'></script>
<script type="text/javascript" src="{{ STATIC_URL }}media/javascript/pipe.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}media/javascript/imdb_form.js"></script> <!-- FUTURE: call from IMDB widget? -->
Note that it's only complaining about the non-admin URLs.
Finally, I also noticed that if I run ./manage.py collectstatic, it collects only the admin files into my STATIC_ROOT directory, not my app's media files. Futhermore, even if I wipe out the STATIC_ROOT directory, the admin links still work.
How can I work through those 404 errors and get all my static files served up properly?
Set your STATICFILES_DIRS variable in settings.py to contain the path to where the static assets are. This should bring them in when running ./manage.py runserver with DEBUG = True
Also I would use environment vars to extend the tuple for STATICFILES_DIRS
if os.environ['deploy_type'] == 'prod':
STATICFILES_DIRS += ("/var/www/html/static/",)
else:
STATICFILES_DIRS += (os.path.join(PROJECT_DIR, 'static'),)
You can have your environment variables set as part of your deployment process and assist in having a flexible deployment process.
Sorry for the bit of a tangent and hope this helps :)