Display uploaded images in the website - Django

Question

I have been trying to display my images in my html page and I did do it correct but it wont work I don't know why this is the last update of django I have watched and read alot of videos and article and do the same as they told me to do but it not working the image wont work in my html template

Hope anyone can help me with this Thank you

admin.py

from django.contrib import admin

# Register your models here.
from .models import *


admin.site.register(slideshowgo)

settings.py

STATIC_URL = '/static/'

MEDIA_URL = '/images/'

STATICFILES_DIRS = [
   BASE_DIR / 'static',
]

MEDIA_ROOT = BASE_DIR / 'static/images'

models.py

from django.db import models


class slideshowgo(models.Model):
image_one = models.ImageField(null=True,blank=True)

slideshow html

<div class="slide">
<img class="mySlides imgslide" src="{{slideshowgo.image_one.url}}">
</div>

urls.py

from django.contrib import admin
from django.urls import path,include
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
   path('admin/', admin.site.urls),
   path('',include('card_store.url')),
] 

if settings.DEBUG:
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

Answer 1

In settings.py put the following config

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

And in your main urls.py file ( one which is located in the same app as of settings.py )

Add this

from django.conf.urls.static import static
from django.conf import settings

urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

This will work for DEBUG = True For DEBUG = False it won't as Django cannot server media files by itself, so you need to setup NGINX or APACHE.

One workaround is to put the following URL's in your main urls.py ( Not recommended for production )

re_path(r'^media/(?P<path>.*)$', serve,{'document_root': settings.MEDIA_ROOT}),
re_path(r'^static/(?P<path>.*)$', serve,{'document_root': settings.STATIC_ROOT}),