Django can not show image in folder - django

I create folder images path static/media/images/ and upload image 02.jpg to folder images by FTP. I want to show image 02.jpg to index.html but it's not show image. This is my code.
urls.py
urlpatterns = [
path('admin/', admin.site.urls),
path('', views.index),
]
if settings.DEBUG:
urlpatterns+=static(settings.MEDIA_URL,document_root=settings.MEDIA_ROOT)
urlpatterns+=static(settings.STATIC_URL,document_root=settings.STATIC_ROOT)
settings.py
#BASE_DIR is project location
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
MEDIA_URL='/media/'
MEDIA_ROOT=os.path.join(BASE_DIR, 'static', 'media')
index.html
{% load static %}
<img src="{% static '/images/02.jpg' %}" class="d-block w-100" alt="">
How to fix it ?

Now I can fix it by using.
<img src="/media/images/02.jpg" class="d-block w-100" alt="">

Related

Django is loading static files but not image that are stored from backend in production

As the title says, after I changed DEBUG to False, the image that is uploaded from the admin panel are not loading. However, other static files like css files and images that are loaded only from HTML side are rendered properly.
urls.py
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('marathon.urls', namespace='homepage')),
path('accounts/', include('allauth.urls')),
path('logout', LogoutView.as_view(), name='logout'),
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
html file that renders image
<div class="js-billboard">
{% for slide in slider %}
<div class="billboard__item">
<figure><img src="{{ slide.image.url }}" alt="Mountain Marathon"></figure>
<div class="billboard__detail">
<div class="grid-container">
<div class="grid-x grid-padding-x">
<div class="col-12 cell">
<h2>{{ slide.title }}</h2>
<p><span>{{ slide.description }}</span></p>
{{ slide.link_title }}
</div>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
I assume you have the following line of code in your projects urls.py
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
Please note that static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) for your media urls will only be added to your urlpatterns list if DEBUG=True in this case. Django doesn't serve media files in Production or when the DEBUG=False
I would suggest using a online storage API like AWS3, cloudinary or even firebase. These do offer the capability of serving media files whether DEBUG=True or DEBUG=False.
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
urlpatterns += static(settings.STATIC_URL, document_root = settings.STATIC_ROOT)
add this in your main your urls.py folder and create a forlder name staic cdn in you main project and in your settings.py
STATIC_CDN = BASE_DIR / 'static_cdn'
and in bottom
STATIC_ROOT = STATIC_CDN
# MEDIA
MEDIA_ROOT = MEDIA_DIR
MEDIA_URL = '/media/'
and then run
python manage.py collectstatic
in your terminal what it will do it will create copy of you static file in your static cdn folder because cloud base storage look your static or media file in you cdn folder
and make sure you install pillow
and tell me if you still getting error

Media Files not Loading on pythonanywhere.com (Django)

website: https://willpeoples1.pythonanywhere.com/
I deployed a personal portfolio project using pythonanywhere.com's server and my instructor sent me a video explaining why my media files weren't loading properly (https://d.pr/v/RARFcF). However, I couldn't understand why he was telling me to change the pathname of the image in my HTML b/c I am using a template in the img-tag. Any clue where I should go from here? Thanks
settings.py:
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
MEDIA_URLS = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
urls.py:
from django.contrib import admin
from django.urls import path, include
from django.conf.urls.static import static
from django.conf import settings
from portfolio import views
urlpatterns = [
path('admin/', admin.site.urls),
path('', views.home, name='home'),
path('blog/', include('blog.urls')),
]
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
home page HTML file:
<div class="conatainer text-center">
{% for proj in Projects %}
<hr>
<h2>{{ proj.title }}</h2>
<p>{{ proj.description }}</p>
<img src= "{{ proj.image.url }}" target="_blank" height="300" width="300">
<br>
<br>
{% endfor %}
</div>
This is all set. There was a spelling mistake in my settings.py file. I wrote "MEDIA_URLS" instead of "MEDIA_URL".

Django can't load media image if DEBUG = False (WARNING:django.request:Not Found: /media/cache/)

User uploaded media images are not loading unless I have DEBUG set to True in my settings file. I'm getting the following error in my logs:
WARNING:django.request:Not Found: /media/cache/ae/d2/aed2b5f7dcd26e01a2a9721540ee6e8e.jpg
That exact folder path does exist locally and that image file does exist. I'm pretty lost what to do from here. I read all the other answers with similar questions and tried everything. If I set DEBUG = True, the images load just fine in both local dev and Heroku environments. Once DEBUG = False, the images don't load in either environment.
Here's my code:
settings.py
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')
STATIC_URL = '/static/'
# Extra places for collectstatic to find static files.
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)
#STATICFILES_STORAGE = 'django.contrib.staticfiles.storage.StaticFilesStorage'
STATICFILES_STORAGE = 'whitenoise.django.GzipManifestStaticFilesStorage'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'
urls.py
urlpatterns = [ ... ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
html template:
{% load static %}
{% load thumbnail %}
{% thumbnail profile.profile_image "168x168" as im %}
{{im.url}}
<img src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}" alt="profile image" class="avatar avatar-xl mb-4">
{% empty %}
<img src="{% static 'assets/img/icons/theme/general/user.svg' %}" alt="Confirmation Icon" class="icon bg-primary" data-inject-svg="data-inject-svg">
{% endthumbnail %}
im.url does produce the correct file path to the image. Any ideas? Thanks!

DJango read static file Json

I am learning django, I would like to read a json file but I do not kown where to put it cause I cannot display.
I have place the file in the folder "static_project" but it is not working
Here is the structure of my project:
src=>templates=> Main=> home.html
src=>Myproject=> settings.py
src=>Myproject=>urls.py
here the html:
{% load static %}
<lottie-player
src= src="{% static "./myfile.json" %}" background="transparent" speed="1" style="width: 700px; height: 700px;" loop autoplay >
</lottie-player>
</div>
Hereis the main urls.py
if settings.DEBUG:
import debug_toolbar
urlpatterns += [
path('__debug__/', include(debug_toolbar.urls)),
]
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
Here is my setting :
STATIC_URL = '/static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, "static_project")
]
STATIC_ROOT = os.path.join(os.path.dirname(BASE_DIR), "static_cdn", "static_root")
#every time a user upload folder, it will be inside the static_cdn folder and the root "media root"
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(os.path.dirname(BASE_DIR), "static_cdn", "media_root")
Thanks for your help

In Django project Media folder is not getting created

There is no media folder in the project, and i can see the media in db, but it won't load on template.
With this error:
Not Found: /DSC_0008.JPG
settings.py
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'
urls
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'', include('UserProfile.urls')),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
index.html looks something like this:
<div class="profile-userpic">
<img src="{{ my_details.associate_image.url }}" width="150" height="150" class="img-responsive" alt="my pic">
</div>
For development server,
urlpatterns = [
# ...
]
if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
This will create your media folder when DEBUG = True in your settings.
Make sure your image path {{ my_details.associate_image.url }} is correct. The media url must be like 127.0.0.1:8000/media/..filename.ext..