media和static的区别：

static属于静态资源如：css\js\font\logo
media属于用户数据、网站数据如：上传的头像、产品图片、个人相册，这些内容关联到用户、产品...身上，具有数据访问的操作(增删改查)，又需要url进行访问.不属于python manage.py collectstatic需要的内容

如果static和media混杂在一起，一旦这些资源过于庞大后，python manage.py collectstatic白白占用了硬盘存储

使用：

index.html:

<img src="{{ MEDIA_URL }}{{ product.main_img }}" class="card-img-top" alt="...">

相关配置

settings.py:

...
TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates')]
        ,
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
                'django.template.context_processors.media',    #新增，用于template tag----{{ MEDIA_URL }}
            ],
        },
    },
]
...
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR,'media')

urls.py:

from django.urls import path
from main_app import views

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

urlpatterns = [
    path('',views.IndexView.as_view(),name="index"),
    path('product/index/',views.ProductView.as_view(),name="product"),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)   #新增用于url的访问

参考链接

https://docs.djangoproject.com/en/3.1/ref/settings/#std:setting-MEDIA_ROOT