图片不能在html中显示答案

【问题标题】：Images cannot be shown in html图片不能在html中显示
【发布时间】：2018-01-01 12:11:55
【问题描述】：

图片不能在html中显示。我在models.py中写了代码

class POST(models.Model):
    title = models.CharField(max_length=100)
    image = models.ImageField(upload_to='images/', blank=True, null=True)
    created_at = models.DateTimeField(auto_now_add=True)

在views.py中

def top(request):
    content = POST.objects.order_by('-created_at')[:5]
    return render(request, 'top.html',{'content':content})

在 top.html 中

<div>
         {% for item in content %}
            <div>
                 <h2>{{ item.title }}</h2>
                 <img src="{{ item.image }}"/>
            </div>
         {% endfor %}
</div>

当我在浏览器中访问时，会显示 html。显示<h2>{{ item.title }}</h2> 但不存在 <img src="{{ item.image }}"/>。当我在 GoogleChrome 中看到页面源时，显示<img src="/images/photo.jpg"/>。但是当我点击 url 时，会发生 404 错误。我的应用程序有 image/images 文件夹，在 images 文件夹中肯定我上传的图片在那里。我真的不明白为什么会发生这种情况。我在 settings.py 中写了 MEDIA_ROOT&MEDIA_URL 所以我认为图像是在浏览器中显示。我应该如何解决这个问题？

【问题讨论】：

标签： python html django

【解决方案1】：

确保您的 /images 文件夹在 Django 中是可访问的。一个简单的方法是在 settings.py 中添加“images”文件夹。喜欢：

IMAGE_URL = '/images/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "images"),
    '/images/',
]

然后在你的 html 文件的顶部添加 {% load images %}。

【讨论】：

【解决方案2】：

首先确保您的项目 urls 文件中有这些行

# Your imports ....
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [.......]

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

在你的模板中使用

{{ item.image.url }}

【讨论】：

【解决方案3】：

使用相对文件夹：

<img src=".{{ item.image }}"/>

导致

<img src="./images/photo.jpg"/>

并检查上传是否成功以及图像是否存在。

【讨论】：

谢谢你的回答。我写了代码<img src="./image/{{ content.image }}"/> 和<img src="./{{ content.image }}"/> 但那里没有显示图片。我应该如何解决这个问题？

【解决方案4】：

试试这个：<img src="/image{{ item.image }}"/>

/ ：表示“根”

. ：表示“当前目录”

所以如果您的根应用程序有图像文件夹，您需要以 /image 开始您的路径

【讨论】：

谢谢你的回答。我写了你的代码和<img src="../image/{{ content.image }}"/>，但没有显示图像。我在html前面添加了`{% load staticfiles %}`，但同样的情况发生了。我在设置中添加了.pyIMAGE_URL = '/images/' STATICFILES_DIRS = [ os.path.join(BASE_DIR, "images"), '/images/', ]
html 文件在模板文件夹中
如果您的服务器是 Linux（我认为是），请使用 chmod 命令（在 Linux 中）检查您对图像和图像文件夹的权限。最后，如果您从浏览器中看到源代码，然后复制并粘贴图像的 URL，您将获得图像，如果看不到它，则表示该文件夹的权限不足或您的地址是错了
请检查您在浏览器上写网址时，是否显示您的图片？您可以使用特定的 URL 显示您的图像吗？如果是，请在此处填写真实的完整地址。
请告诉我您何时使用<img src="/image{{ item.image }}"/> 您的 html 代码的结果是什么？谢谢