首页 > 解决方案 > Django - 图像不会在我的个人资料页面中上传和更改

问题描述

我正在处理我网站的个人资料页面。
更改用户名或电子邮件有效,但不能更改个人资料图片,我不明白为什么:(

我在“INSTALLED_APPS”中添加了我的个人资料应用程序,设置了 MEDIA_ROOT 和 MEDIA_URL 并设置了 urlspatterns:

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'home.apps.HomeConfig',
    'inscription.apps.InscriptionConfig',
    'profil.apps.ProfilConfig',
]

[...]

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

urls.py:

urlpatterns = [
    path('profil/', p.profil, name='profil'),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

我将用户链接到其个人资料,并在 models.py 中设置了默认图像

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

class Profil(models.Model):
    user = models.OneToOneField(User, on_delete=models.CASCADE)
    image = models.ImageField(default='defaut.png', upload_to='image_profil')

    def __str__(self):
        return f'{self.user.username} Profil'

管理员.py:

from django.contrib import admin
from .models import Profil

admin.site.register(Profil)

然后我在 forms.py 中创建了配置文件修改表单:

from django import forms
from django.contrib.auth.models import User
from django.contrib.auth.forms import UserCreationForm
from .models import Profil

class FormulaireModifUtilisateur(forms.ModelForm):
    username = forms.CharField(
        label = 'Nom de compte',
        min_length = 4,
        max_length = 150,
        initial=User.username,
    )
    email = forms.EmailField(
        label = 'Email',
        min_length = 4,
        max_length = 150,
    )

    class Meta:
        model = User
        fields = ['username', 'email']

class FormulaireModifProfil(forms.ModelForm):
    image = forms.FileField(
        label = 'Image de profil'
    )
    class Meta:
        model = Profil
        fields = ['image']

然后我在 views.py 中使用它:

from django.shortcuts import render, redirect
from django.contrib.auth.decorators import login_required
from django.contrib import messages
from .forms import FormulaireModifUtilisateur, FormulaireModifProfil

@login_required

def profil(request):
    if request.method == 'POST':
        u_form = FormulaireModifUtilisateur(
            request.POST,
            instance=request.user
        )
        p_form = FormulaireModifProfil(
            request.POST,
            request.FILES,
            instance=request.user.profil
        )
        if u_form.is_valid() and p_form.is_valid():
            u_form.save()
            p_form.save()
            messages.success(request, f'Votre compte a bien été mis à jour !')
            return redirect('profil')

    else:
        u_form = FormulaireModifUtilisateur(instance=request.user)
        p_form = FormulaireModifProfil()

    context = {
        'u_form': u_form,
        'p_form': p_form,
    }

    return render(request, 'profil/profils.html', context)

最后,我创建了我的个人资料页面:

{% extends "home/index.html" %}

{% block title %}
Profil
{% endblock %}

{% block content %}
<div id='profil'>
    <img src='{{ user.profil.image.url }}'>
    <form method="post">
        {% csrf_token %}
        {% for field in u_form %}
            <p>
                {{ field.label_tag }}<br>
                {{ field }}<br>
            </p>
        {% endfor %}
        {% for field in p_form %}
            <p>
                {{ field.label_tag }}<br>
                {{ field }}<br>
            </p>
        {% endfor %}
        {% for message in messages %}
            <p id="messages">{{message}}</p>
        {% endfor %}
    <button type="submit">Enregistrer</button>
    </form>
</div>
{% endblock %}

我查看了类似问题的答案,但没有任何效果:(

标签: pythonhtmldjango

解决方案


当您使用 HTML 格式的文件时,您应该添加 enctype。

<form method="post" enctype="multipart/form-data">

推荐阅读