Django上传头像中具体问题的解决方案

题目

Django如何简单上传头像

前言

在这里我不会写一些基础的html，js等这些网上百度一下就可以实现，我主要是实现一些在实际过程中真正遇到的问题。

如何点击头像就能上传

1. 核心代码

• enctype="multipart/form-data"
• type="file"
• type="submit"

<form action="#" method="post" enctype="multipart/form-data">
   <img src="#"  id="pic" onclick="图片点击()">
   <input type="file" style="display: none;" onchange="点击函数()" name="image" id='img' ></div>
   <input type="submit" value="图片保存" style="display: none;">   
</form>

2. 实现过程
   第二个input不可见，并且点击图片时，实现图片点击()函数
   • 将第三个input的style：disply=block
   • 点击的同时实现点击函数()

如何点击完要选中的图片后就加载到页面上

1. 核心代码

function 点击函数(){
		var file = $('#img')[0].files[0];
        var pic = document.getElementById('pic');
        var temp_file = new FileReader();

        // 监听变化
        temp_file.addEventListener("load", function() {
            pic.src = temp_file.result;
        }, false);

        if (file) {
            temp_file.readAsDataURL(file);
        }
}

如何将头像保存到Django工程中

views.py

def save(request):
    user = findCurrentUser(request)
    # 得到的是第二个input里的name值
    image = request.FILES.get('image')
    # 获取image文件中的图片名称
    image_path = image.name
    # 写入文件
    if image:
        # 将image的路径加一些时间用户等信息，避免重名【custom_path】
        save_path = custom_path(image_path)
        # settings.MEDIA_ROOT 是在settings.py中创建的，不会的直接看下面
        save_url = settings.MEDIA_ROOT+"/"+save_path
        try:
        	# imagepath是user里的属性
            user.imagepath = save_path
            user.save()
            # 写入图片文件，
            with open(save_url【文件名】,'wb+'【文件操作方式】) as f:
                f.write(image.read())【读取image文件】
        except Exception as e:
            print(e)
    return redirect('/page')

settings.py中创建路径

STATIC_URL = '/static/'

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