使用 Django 上传图像并在网页上显示答案

【问题标题】：Upload an image and display it on a webpage with Django使用 Django 上传图像并在网页上显示
【发布时间】：2016-05-20 21:42:13
【问题描述】：

我是 Django 的新手，我一直在关注 django 教程“djangogirl”，但我想添加图片，所以我做了一个 model.py 像这样：

class Post(models.Model):
   author = models.ForeignKey('auth.User')
   image = models.ImageField()
   title = models.CharField(max_length=200)
   text = models.TextField()
   created_date = models.DateTimeField(default=timezone.now)
   published_date = models.DateTimeField(blank=True, null=True)

def publish(self):
    self.published_date = timezone.now()
    self.save()

def __str__(self):
    return self.title

这是我的view.py：

def posts(request):
    posts = Post.objects.order_by('published_date')
    return render(request, 'my_blog/posts.html', {'posts': posts})

还有my_blog.html:

{% extends 'my_blog/base.html' %}
{% load staticfiles %}
{% block content %}
<link rel="stylesheet" href="{% static 'style/css/posts.css' %}">

<div id="postsContainer">
    <div id="posts">
        {% for post in posts %}
        <div>
            <h3 class="date">Published the: {{ post.published_date }}</h3>
            <h1><a href="">{{ post.title }}</a></h1>
            <img src="{{ post.image.url }}"/>
            <p>{{ post.text|linebreaks }}</p>
        </div>
        <div id="button">
            <button type="button" class="btn btn-primary">Read more</button>
        </div>
        <div class="top-divider"></div>
        {% endfor %}
    </div>
</div>
{% endblock %}

我通过 Django 管理页面插入我的图像。

问题是在我的 HTML 中返回的 URL 非常奇怪，例如：./images_SseHlrA.png，而且它显然不能正确显示图片。我该如何解决？

显然，图片在根级别“存储”（与文件manage.py 相同的级别，问题是为什么？我该如何更改它，最好的方法是什么？

【问题讨论】：

标签： python django templates url

【解决方案1】：

alix 是正确的，“您需要指定存储用户上传的图像的位置”，方法是在字段构造函数中指定 upload_to。但是你不需要一个特殊的类来处理所有这些。太复杂了。假设您的设置中有这个：

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

在您的模板中，您现在应该能够执行以下操作：

<img src="{{ post.image.url }}">

【讨论】：

好的，谢谢，现在我得到了一个正常的网址“/uploads/illustrations/images.png”。但是还是找不到图片。 “上传”文件夹是在根级别创建的，图像存储在一个目录中，我应该在我的模板中导入一些东西吗？就像我对静态文件所做的那样：{% load staticfiles %}
如果您在呈现的页面上查看源代码，图像的 URL 是什么？现在检查 MEDIA_URL docs.djangoproject.com/en/1.9/ref/settings/#media-url 的 Django 文档 - 你的设置是否正常工作？ MEDIA_URL 和 MEDIA_ROOT 用于定义上传媒体的位置。

【解决方案2】：

您需要指定存储用户上传的图像的位置。在您的models.py 中试试这个：

from django.utils.deconstruct import deconstructible

@deconstructible
class PathAndRename(object):

    def __init__(self, sub_path):
        self.path = sub_path

    def __call__(self, instance, filename):
        ext = filename.split('.')[-1]
        # set filename as random string. change here as you want
        filename = '{}.{}'.format(uuid4().hex, ext)
        # return file path
        return os.path.join(self.path, filename)

path_and_rename = PathAndRename("/images")

然后在模型中：

image = models.ImageField(upload_to=path_and_rename)

你可以阅读更多关于ImageFieldhere和here的信息

【讨论】：