Django 图片 头像 文件 上传 展示

妈呀,Django好叼的呦喂

我是在windows下搞的啊

1. settings.py里面要写的

首先定义 MEDIA_ROOT 作为Django存储上传文件的路径

MEDIA_ROOT = os.path.join(BASE_DIR, 'upload_picture').replace('\\','/')

然后定义一个 MEDIA_URL 作为基础的URL或者目录,MEDIA_URL指向MEDIA_ROOT所指定的media文件

MEDIA_URL = '/upload_picture/'

2. models.py

要用FileField字段.参数upload_to指向的内容是个子文件夹,也就是说上传的文件的目录结构是: 项目目录/upload_picture/headImg/黑人问号脸.jpg

class Userphoto(models.Model):
    userid = models.ForeignKey('auth.User', blank=False, null=True, verbose_name='用户')
    headImg = models.FileField(upload_to='headImg')

3. views.py

存到数据库里面的是图片的路径和名字
删掉老数据,存新数据

def uploadImg(request):
    from .models import Userphoto
    if request.method == 'POST':
        Userphoto.objects.filter(userid=request.user).delete()
        new_img = Userphoto(userid=request.user, headImg=request.FILES.get('img'))
        new_img.save()
    return redirect('pythonnav:blogindex_html')

图片展示的方法

def blogindex_html(request):
    #获取用户头像的图片
    imgs = Userphoto.objects.filter(userid=request.user)
    return render(request,'blogindex.html',{'imgs':imgs })

4. 前端html

图片提交和展示
注意展示的时候{{ img.headImg }}前面加上upload_picture/,这种方法很笨拙,

<div class="user-head">
<form role="form" enctype="multipart/form-data" action="{% url 'pythonnav:uploadImg' %}" method="POST">

{% csrf_token %}

<a href="javascript:;" class="inbox-avatar">

{% for img in imgs %}
<img src="upload_picture/{{ img.headImg }}" alt="">
{% endfor %}

</a>
<div class="user-name">
<h5><a href="#">{{ request.user.username }}</a></h5>
<span><a href="#">{{ request.user.email }}</a></span>

</div>
<div class="user-name">
<input class="btn-info" type="file" name="img">
<button class="btn-info" type="submit">变成头像</button>
</div>

</form>
</div>

展示图片当然还有更优雅的方法,就是在模版中使用 {{ MEDIA_URL }} 具体参考:http://python.usyiyi.cn/documents/django_182/ref/settings.html#std:setting-MEDIA_URL
为啥我不用优雅的方法?哎呀呀我这里如果用优雅的方法就会在前面多个/,我不知道为啥多个/之后链接里就不出现pythonnav这个app名字了很愁

还有更更优雅的方法,直接用{{ img.headImg.url }},但是同样面临上面的问题,前端解析出来的是http://127.0.0.1:8000/upload_picture/headImg/mail-avatar.jpg 而不是 http://127.0.0.1:8000/pythonnav/upload_picture/headImg/mail-avatar.jpg

百思不得姐啊,怎么办怎么办,后来想出来个办法,就是把

MEDIA_URL = '/upload_picture/'

改为

MEDIA_URL = 'upload_picture/'.

这样就没有/导致的问题了,天下太平了