Django中食谱图片无法上传排查请求（头像上传正常）

我在Django网站中已经实现了正常运行的头像上传功能，但为食谱帖子添加图片上传时，图片始终无法存入目标文件夹——后台上传食谱图片正常，头像上传功能也没问题，无任何错误提示，就是图片存不进指定文件夹。

正常运行的头像上传代码 #

models.py #

class Profileuser(models.Model):
    owner = models.OneToOneField(User, on_delete=models.CASCADE)
    name = models.CharField(max_length=50)
    tagline = models.CharField(max_length=100)
    bio = models.TextField(blank=True)
    website = models.URLField(blank=True)
    profile_pic = models.ImageField(upload_to="profiles/", blank=True)

    def __str__(self):
        return f"{self.id} | {self.name}"

views.py #

class ProfileuserCreateView(LoginRequiredMixin, CreateView):
    model = Profileuser
    fields = ['name', 'profile_pic', 'tagline', 'bio', 'website']
    success_url = reverse_lazy('recipes-home')

    def form_valid(self, form):
        form.instance.owner = self.request.user
        return super(ProfileuserCreateView, self).form_valid(form)

urls.py #

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

无法正常上传的食谱图片代码 #

models.py #

class Recipe(models.Model):
    title = models.CharField(max_length=100)
    recipe_image = models.ImageField(upload_to="imagerecipes/", blank=True)
    ingredients = models.TextField()
    description = models.TextField()
    author = models.ForeignKey(User, on_delete=models.CASCADE)
    created_at = models.DateTimeField(auto_now_add=True)
    updated_at = models.DateTimeField(auto_now=True)

    def get_absolute_url(self):
        return reverse('recipes-detail', kwargs={"pk": self.pk})

    def __str__(self):
        return self.title

views.py #

class RecipeCreateView(LoginRequiredMixin, CreateView):
    model = models.Recipe
    fields = ['title', 'recipe_image', 'ingredients', 'description']

    def form_valid(self, form):
        form.instance.author = self.request.user
        return super().form_valid(form)

模板代码（初始及错误修改版） #

初始模板：

{% extends 'recipes/base.html' %}
{% load tailwind_filters %}

{% block content %}
<div>
    <h1 class="text=2x1 my-4">Add Recipe!</h1>
    <form method="POST">
        {% csrf_token %}
        {{ form|crispy }}
        <input class="px-8 py-2 text-white bg-orange-600 rounded-lg hover:bg-orange-700 hover:cursor-pointed" type="submit" value="Save">
    </form>
    <div class="border-top pt-3">
        <a href="{% url 'recipes-home' %}">Cancel</a>
    </div>
</div>
{% endblock content %}

尝试添加enctype但位置错误的修改版：

{% extends 'recipes/base.html' %}
{% load tailwind_filters %}

{% block content %}
<div>
    <h1 class="text=2x1 my-4">Add Recipe!</h1>
    <form method="POST">
        {% csrf_token %}
        {{ form|crispy }}
        <input class="px-8 py-2 text-white bg-orange-600 rounded-lg hover:bg-orange-700 hover:cursor-pointed" type="submit" enctype="multipart/form-data" value="Save">
    </form>
    <div class="border-top pt-3">
        <a href="{% url 'recipes-home' %}">Cancel</a>
    </div>
</div>
{% endblock content %}

问题原因与解决方法 #

核心问题是表单的enctype属性位置错误：上传文件的表单必须在<form>标签上声明enctype="multipart/form-data"，你错误地把这个属性加在了提交按钮上，导致Django无法接收文件数据。

修正后的模板代码：

{% extends 'recipes/base.html' %}
{% load tailwind_filters %}

{% block content %}
<div>
    <h1 class="text-2xl my-4">Add Recipe!</h1>
    <form method="POST" enctype="multipart/form-data">
        {% csrf_token %}
        {{ form|crispy }}
        <input class="px-8 py-2 text-white bg-orange-600 rounded-lg hover:bg-orange-700 hover:cursor-pointer" type="submit" value="Save">
    </form>
    <div class="border-top pt-3">
        <a href="{% url 'recipes-home' %}">Cancel</a>
    </div>
</div>
{% endblock content %}

同时修正了两个小笔误：

• text=2x1 改为 text-2xl（Tailwind CSS正确类名）
• hover:cursor-pointed 改为 hover:cursor-pointer（正确光标类名）

内容的提问来源于stack exchange，提问作者C0untV