404（未找到）：如何在 html 中显示模型的图像？答案

【问题标题】：404 (Not Found): How to show an image of a model in html?404（未找到）：如何在 html 中显示模型的图像？
【发布时间】：2019-11-26 07:01:16
【问题描述】：

我目前正在尝试找出为什么会出现 404 错误（未找到）。我已将模型的 ImageField 上传到静态文件“article_img”。但是当我想在 html 站点上显示存储的图像时，找不到资源。

这是什么原因？

from django.db import models
from django.utils.translation import gettext_lazy as _

class Article(models.Model):
    group = models.ForeignKey(Group, on_delete=models.SET_NULL, verbose_name=_('group'), null=True)
    name = models.CharField(_('name'), max_length=200)
    image = models.ImageField(_('image'), upload_to='./static/lagerverwaltung/article_img/', blank=True, null=True)

   <div id="article_img_div">
        {% load static %}
        {% if article.image %}
            <img class="article_img" type="image" src="{{ article.image.url }}" alt="{% static 'lagerverwaltung/article_img/none.jpg' %}">
        {% endif %}
    </div>

【问题讨论】：

在网络选项卡中签入您的控制台 (F12)。该图像应该有一个 HTTP 请求。自己试试那个网址，你可能会明白哪里错了。
如果您不这样做，请在您的问题中添加更多信息，例如：您使用的是什么网络服务器？ django开发服务器？ nginx的？其他？你能显示你的 django settings.py 文件（隐藏密钥）吗？

标签： html django-models imagefield

【解决方案1】：

由于您使用 Django 作为 Web 框架，因此请确保您的项目结构正确。您的静态文件应存储在名为 static 的文件夹中；例如，一个带有 Django 的图像文件应该存储在：

my_app/static/my_app/image.jpg

Django 的文件结构documentation 还指定了如何提供静态图像。

确保 django.contrib.staticfiles 包含在您的 INSTALLED_APPS 中。

定义 STATIC_URL：STATIC_URL = '/static/'

在您的模板中，使用静态模板标签通过配置的 STATICFILES_STORAGE 为给定的相对路径构建 URL。

{% load static %} <img src="{% static "my_app/example.jpg" %}" alt="My image">

就像另一条评论所说的那样，您可以在开发者控制台中查看转到图像的 HTTP 请求，您可能会在那里找到针对您的问题的更多信息。（Chrome 中的 Ctrl + Shift + I）

【讨论】：

我还建议您探索 bottimus 框架来完成这项任务。