Django1.11 擴充User屬性增加頭像上傳功能

Django內建的User模型沒有頭像和電話這兩項屬性，因此需要通過擴充User達到我們想要的效果，根據官方的文檔，擴充新欄位到User只需要用one-to-one(一對一）模型即可。

一、建立一個APP

python manage.py startapp CustomUser

二、在models裡面建立使用者模型，使用one-to-one關聯User

from django.db import models# Create your models here.from django.contrib.auth.models import Userclass MyUser(models.Model):    user = models.OneToOneField(User)    phone = models.CharField(u'手機號',max_length=13, null=True, blank=True)    avatar = models.ImageField(u'管理員頭像',upload_to='images', null=True, blank=True)    class Meta:        verbose_name = u'頭像管理'

三、增加admin配置，admin後台可以填寫這兩個新欄位：

from django.contrib import adminfrom django.contrib.auth.admin import UserAdmin as BaseUserAdminfrom django.contrib.auth.models import Userfrom CustomUser.models import MyUser# Define an inline admin descriptor for Employee model# which acts a bit like a singletonclass EmployeeInline(admin.StackedInline):    model = MyUser    can_delete = False    verbose_name_plural = u'管理中心'# Define a new User adminclass UserAdmin(BaseUserAdmin):    inlines = (EmployeeInline, )# Re-register UserAdminadmin.site.unregister(User)admin.site.register(User, UserAdmin)

admin後台效果：

四、修改settings User指向：

AUTH_USER_MODULE = 'CustomUser.MyUser'

五、產生資料庫：

python manage.py makemigrations CustomUser

python manage.py migrations

六、上傳頭像需要media配置，故settings需增加配置：

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

在manage.py同一層建立media目錄

七、配置urls.py：

from django.conf import settings
from django.conf.urls.static import static

urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

八、template上使用頭像：

<ul class="nav navbar-nav navbar-right">   <li class="dropdown navbar-user">      <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown">         <img src="{{ request.user.myuser.avatar.url }}" alt="" />         <span class="hidden-xs">{{ request.user.username }}</span> <b class="caret"></b>      </a>      <ul class="dropdown-menu animated fadeInLeft">         <li class="arrow"></li>         <li><a href="javascript:;">編輯資料</a></li>         <li><a href="javascript:;">重設密碼</a></li>         <li class="divider"></li>         <li><a href="{{ url('logout') }}">退出系統</a></li>      </ul>   </li></ul>