如何从 django 表单 ImageField 输入中获取图像

Question

我正在尝试从输入 ImageFile 获取图像以显示在模板中，并将该 ImageFile 保存到模型 ImageField。

下面的代码吐出一个错误：

upload_img_temp.write(uploaded_image)
TypeError: a bytes-like object is required, not 'str'

形式

class UploadImageForm(forms.ModelForm):
    class Meta:
        model = Image
        fields = ['image']

看法

def uploadImageView(request):
    form = UploadImageForm(request.POST or None, request.FILES or None)
    if request.method == 'POST':
        if form.is_valid:
            request.session['image'] = request.POST['image']
            return redirect('image:create')

def imageCreateView(request):
    uploaded_image = request.session.get('image')
    upload_img_temp = NamedTemporaryFile()
    upload_img_temp.write(uploaded_image)
    upload_img_temp.flush()

    form_create = ImageModelCreateForm(request.POST or None, request.FILES or None,)

    if form_create.is_valid():
        instance = form_create.save(commit=False)
        instance.image = upload_img_temp

模板

<img class="image" src="{{ upload_img_temp }}">

  <form method="POST" action="">
    {% csrf_token %}
    <input type="submit"></input>
    {{ form }}
  </form>

Model

def upload_location(instance, filename):
    filebase, extension = filename.split(".")
    return "%s/%s.%s" %('picx', uuid.uuid4(), extension)

class Image(models.Model):
    image           = models.ImageField(
                        upload_to=upload_location,
                        null=False,
                        blank=False,
                        )

Answer 1

因此，您有多个问题。

1. <form method="POST" action="" enctype='multipart/form-data' >

您需要添加enctype='multipart/form-data'的form ，否则没有文件将被接受。

2. 要显示图像，您需要类似<img class="image" src="{{Image.image.url}}">请注意，“ Image”必须是您在views.py上下文部分中定义的有效参数。对于此模板。 它是对模型的引用，第二个“ image”关键字是指模型属性“ image”。 .url是必需的。

3. 将您的views.py更改为类似内容：

    def uploadG(request): form = PostForm(request.POST or None, request.FILES or None) if form.is_valid(): print ("form was valid TEST") #controll your console and check if that statement appears when you click upload. instance = form.save(commit = False) .... instance.save() messages.success(request, 'You uploaded it') 

希望能有所帮助。 如果不发表评论

Answer 2

该错误可能有多种可能性。 首先，您需要确保在 upload_to='images' 之类的引号中指定 upload_to 属性

class ProductImage(models.Model):
    image = models.ImageField(
               upload_to='images',
               null=False,
               blank=False,
              )

这将在 media 文件夹下创建一个名为 images 的文件夹，并将图像放在该 images 文件夹中。 其次，您需要确保在标签内添加 enctype='multipart/form-data' 作为

<img class="image" src="{{ upload_img_temp }}">

  <form method="POST" action="">
    {% csrf_token %}
    <input type="submit"></input>
    {{ form }}
  </form>

第三而不是将图像保存到 session 你可以简单地将图像保存到你的 model class 作为 model 实例说

def uploadImageView(request):

    def uploadImageView(request):
        form = UploadImageForm(request.POST or None, request.FILES or None)
        if request.method == 'POST':
            if form.is_valid:
                form.save()
                context['form']=form
                return render(request, 'your_file_name.html', 
                {'context':context}
                )

并通过将 img url 设置为访问模板中的图像实例

<img url="{{form.image.url}}">

Answer 3

您是否希望图像在用户实际单击表单的“提交”按钮之前可见？

为此，您可能应该考虑处理Ajax请求。

如果只想在页面上显示图像，例如要上传图像，将其保存到数据库中，然后从数据库中获取其url并将其放在模板中，则只需调用图像字段的“ url”属性即可。

例如：您的模型如下：

class ProductImage(models.Model):
    image           = models.ImageField(
                        upload_to=upload_location,
                        null=False,
                        blank=False,
                        )

并且您已经将图像保存在数据库中。

要将其从数据库传递到模板，您应该在视图中执行以下操作 ：

p_image = ProductImage.objects.get(id=3)
context['product_image'] = p_image
return render (request, 'template.html', context)

然后在您的模板中 ：

<img class="product-image" src="{{ product_image.image.url }}"/>

实际上，使用Ajax几乎是一样的事情，只有您应该通过javascript发送表单和更新页面。

Answer 4

形式：object = active_form（request.POST 或 None，request.FILES 或 None，instance=post）