Django个人博客搭建教程---图片存储与展示_django 博客图片展示-优快云博客

本文链接：https://blog.youkuaiyun.com/ssjdoudou/article/details/86547914

本文介绍如何在Django项目中实现图片的数据库存储及前端展示功能，包括models定义、admin配置、URL设置及settings调整等关键步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

写在最前面：

自己在阿里云部署的一个Django项目，自己给自己提了一个需求，随机展示一张图片配上文字，这样的话数据库就必须存储图片了

下面上代码，仅仅做了admin的存储与前端展示

models.py

class Note(models.Model):
    content =  models.CharField(max_length=1000)
    created_time = models.DateTimeField(auto_now_add=True)
    noteimage = models.ImageField(upload_to='noteimg')

admin.py

admin.site.register(models.Note)

urls.py（主url)

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

    path('admin/', admin.site.urls),
]+static(settings.MEDIA_URL,document_root=settings.MEDIA_ROOT)

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',#新添加的
            ],
        },
    },
]

STATIC_URL = '/static/'
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
    os.path.join(BASE_DIR, 'media'),
    #os.path.join(os.path.dirname(__file__), '../static/').replace('\\', '/'),
)

# 文件上传的路径
MEDIA_URL = '/media/'   # 访问资源的地址如 http://127.0.0.1:5000/media/1.jpg
# 写相对路径也可以
MEDIA_ROOT = os.path.join(BASE_DIR, 'media').replace('\\', '/')

注意，这里一定要加 {{ MEDIA_URL }}，指定media根路径

<div class="ad whitebg imgscale">
      <ul>
          <section class="topnews imgscale"><a href="/"><img src="{{ MEDIA_URL }}{{ note.noteimage }}"><span>{{ note.content }}</span></a></section>
      </ul>
</div>