如何将 Django 中 ImageField 中的图像显示给用户？答案

【问题标题】：How to display Image from ImageField in Django to user?如何将 Django 中 ImageField 中的图像显示给用户？
【发布时间】：2019-03-11 12:42:20
【问题描述】：

我正在尝试在 Django 中显示图像字段中的图像。图像域工作正常。我可以将图像保存到本地存储，但问题是当服务器运行时，我在图像字段的位置看到一个 url。我猜它应该是图像的 url，但是当我点击它时，它只是重新加载当前页面。我怎样才能做到这一点，当我点击它时，我会被带到一个带有图像的页面？这是我尝试过的方法，但它不起作用：

#views.py

class CreateView(generics.ListCreateAPIView):
    """This class defines the create behaviour of our REST Api"""
    queryset = BucketList.objects.all()
    serializer_class = BucketListSerializerPostOnly

    def perform_create(self, serializer):
        """Save post data when creating a new bucketlist"""
        serializer.save()



class DetailsView(generics.RetrieveUpdateDestroyAPIView):
    """This Class handles the http GET, PUT, and DELETE requests"""
    queryset = BucketList.objects.all()
    serializer_class = BucketListSerializer



# shows image in a new tab?
def show_image(request, img):
    context = {
        'image': img
    }
    return render(request, 'images.html', context)


# my html file


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <img src="/media/documents/{{ image }}">
    <a href="/">Go Back</a>
</body>
</html>

# urls.py


urlpatterns = [
url(r'^bucketlist/$', CreateView.as_view(), name='create'),
url(r'^', CreateView.as_view(), name='create'),
url(r'^bucketlist/(?P<pk>[0-9]+)/$', DetailsView.as_view(), name='details'),
url(r'^media/documents/(?P<img>[\w\-]+)/$', views.show_image, 
name='view_image')
]

urlpatterns = format_suffix_patterns(urlpatterns)

【问题讨论】：

标签： python django url-routing imagefield

【解决方案1】：

要使任何 url 正常工作，您首先需要将其正确添加到 urls.py

将 MEDIA_URL 和 MEDIA_ROOT 添加到 settings.py：

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

在项目的根目录中创建“uploaded_files”。

向 urls.py 添加新链接

from . import views, settings
from django.contrib.staticfiles.urls import static
from django.contrib.staticfiles.urls import 

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

显示如下：

<img src="{{ object.image.url }}"/>

【讨论】：

【解决方案2】：

您应该能够使用url 属性，此处记录了https://docs.djangoproject.com/en/2.0/ref/models/fields/#django.db.models.fields.files.FieldFile.url。

在你的模板中你可以这样做：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <img src="{{ image.url }}">
    <a href="/">Go Back</a>
</body>
</html>

为了使图片链接到自身：

<a href="{{ image.url }}">
    <img src="{{ image.url }}">
</a>

【讨论】：

我试过了，但它似乎仍然只是重新加载当前页面