6.7.用户头像上传

定义表单

users/forms.py

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

定义View

users/views.py

class UploadImageView(View):
    def post(self, request):
        upload_image_form = UploadImageForm(request.POST, request.FILES)
        if upload_image_form.is_valid():
            image = upload_image_form.cleaned_data['image']
            request.user.image = image
            request.user.save()
            return HttpResponse('{"status": "success"}', content_type='application/json')
        else:
            return HttpResponse('{"status": "fail", "msg":"失败"}', content_type='application/json')

或者直接保存表单

class UploadImageView(View):
    def post(self, request):
        upload_image_form = UploadImageForm(request.POST, request.FILES, instance=request.user)
        if upload_image_form.is_valid():
            upload_image_form.save()
            return HttpResponse('{"status": "success"}', content_type='application/json')
        else:
            return HttpResponse('{"status": "fail", "msg":"失败"}', content_type='application/json')

设置url

users/urls.py

from django.urls import path

from users.views import UploadImageView

app_name = 'users'
urlpatterns = [
    ...
    path('upload-image/', UploadImageView.as_view(), name='upload_image'),
]

模板

templates/usercenter-info.html

<form class="clearfix" id="jsAvatarForm" enctype="multipart/form-data" autocomplete="off" method="post" action="{% url 'users:upload_image' %}" target='frameFile'>
    <label class="changearea" for="avatarUp">
        <span id="avatardiv" class="pic">
            <img width="100" height="100" class="js-img-show" id="avatarShow" src="{{ MEDIA_URL }}{{ user.image }}"/>
        </span>
        <span class="fl upload-inp-box" style="margin-left:70px;">
            <span class="button btn-green btn-w100" id="jsAvatarBtn">修改头像</span>
            <input type="file" name="image" id="avatarUp" class="js-img-up"/>
        </span>
    </label>
    {% csrf_token %}
</form>