如何在 django 的帖子上添加图片？

Question

我想在 django 管理帖子模型中创建一个上传图片按钮。上传图片后，可以很好地显示在博客卡上，然后显示在网站上的帖子详细信息上。到目前为止，这是我的代码。我应该怎么做才能完成这项工作？

这是我的 blog.html 页面

<div class="container">
   <div class="row">
      <!-- Blog Entries Column -->
      <div class="column">
         {% for post in post_list %}
         <div class="card mb-4">
            <div class="card-body">
               <img class="card-image">{{post.header_image}}</img>
               <h2 class="card-title">{{ post.title }}</h2>
               <p class="card-text text-muted h6">{{ post.author }} | {{ post.created_on}} </p>
               <p class="card-text">{{post.content|slice:":200"}}</p>
               <a href="{% url 'post_detail' post.pk  %}" class="btn-grey">Află mai multe</a>
            </div>
         </div>
         {% endfor %}
      </div>
   </div>
</div>

这是我的帖子detail.html

<div class="container">
   <div class="detail-row">
      <div class="card-detail-body">
         <h1> {{ post.title }} </h1>
         <p class=" text-muted">{{ post.author }} | {{ post.created_on }}</p>
         <p class="card-text ">{{ post.content | safe }}</p>
      </div>
   </div>
</div>

这里是models.py

from django.db import models
import datetime
from django.contrib.auth.models import User

STATUS = ((0,  "Draft"), (1, "Published"))

class Post(models.Model):
    title = models.CharField(max_length=1048)
    slug = models.SlugField(max_length=1048)
    author = models.ForeignKey(User, on_delete=models.CASCADE, related_name='blog_posts')
    related_name=('blog_posts')
    content = models.TextField()
    status = models.IntegerField(choices=STATUS, default=0)
    created_on = models.DateTimeField(auto_now_add=True)
    
    def __str__(self):
        return self.title

这里是views.py

def blogPage(request):
    floaterForm = FloaterForm()
    post_list = Post.objects.all().order_by('-created_on')
    context = {
        'flForm' : floaterForm,
        "post_list": post_list
    }
    return render(request, "blog.html", context)

def post_detail(request, pk):
    post= Post.objects.get(pk=pk)
    context = {
        'post' : post
    }
    return render(request, "post_detail.html", context)

Answer 1

您必须像这样在 models.py 文件中创建一个字段

image = models.ImageField(upload_to="your_upload_dir_name")

那么你必须设置你的media configuration 现在你可以像这样在你的模板中访问你的图像

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

Answer 2

您首先必须在 Django 中创建图像字段。例如

blog_image = models.ImageField(upload_to="/media/blog_images")
#This /image/blog_images is the image directory.

它将图像 URL 保存在模型字段中。然后就可以在图片标签的src中使用这个图片URL了。

html代码应该是这样的。

<form method = "post" enctype="multipart/form-data">
    {% csrf_token %}
    {{ form.as_p }}
    <button type="submit">Upload</button>
</form>

在视图中，您的代码将是这样的。您可以根据自己的配置进行更改。

if request.method == 'POST':
    form = BlogsForm(request.POST, request.FILES)
    if form.is_valid():
         form.save()

然后你必须在你的服务器配置和 settings.py 中设置媒体配置。我主要使用 Nginx，所以我这样做了。

#settings.py
MEDIA_ROOT =  BASE_DIR / 'media'
MEDIA_URL = '/media/'

#ngnix
location /media {
    autoindex on;
    alias /path to media directory of project;
}

如果您仍然感到困惑，请在 cmets 中告诉我。谢谢