2.2博客系统 |FileField字段 |Media配置

基于forms组件和Ajax实现注册功能

1 基于forms组件设计注册页面

　　--点击头像 === 点击input

　　--头像预览：

　　　　修改用户选中的文件对象；获取文件对象的路径；修改img的src属性，src=文件对象路径。

2.错误信息：

　　views：

　　　　forms.errors # {"user"：[......] }

　Ajax.success：
     $.each(data.msg, function(field, error_list){
                        $("#id_"+field).next().html(error_list[0]);  //每次循环都把各自的信息放到input那下面了
                        $("#id_"+field).parent().addClass("has-error");
                    })

3.局部钩子和全局钩子校验

　　user字段不能重复

　　两次密码不能一致

4.FileField（可以上传任何文件）与ImageFiled（只能上传图片）

class UserInfo(AbstractUser):  #用户认证组件，要用用户表；扩展字段，继承AbstractUser类,
    '''用户信息'''
    nid = models.AutoField(primary_key=True)
    telephone = models.CharField(max_length=11, null=True, unique=True)   #这些字段接收一个字符串就可以了
    avatar = models.FileField(upload_to='avatars/', default="/avatars/default.png") #而它一定要接收一个文件对象

avatar_obj = request.FILES.get("avatar")
user_obj = UserInfo.objects.create_user(username = user, password = pwd, email = email, avatar = avatar_obj)#这里avatar一定要接收一个文件对象

Django会实现：
　　会将文件对象下载到项目的根目录中avatars文件夹中（如果没有avatar文件夹，Django会自动创建），user_obj的avatar存的是文件的相对路径。

views.py

def register(request):
    if request.is_ajax():  #你点击那个按钮即使Ajax请求又是post请求。既可以用Ajax也可用method=post作分支判断
        print(request.POST) #把所有提交的数据都取出来
        form = UserForm(request.POST)  #用UserForm做检验，
        response = {"user":None, "msg":None} #发Ajax一般都会返回一个字典来进行标示这些行为
        if form.is_valid():  #数据全通过,成功
            response["user"] = form.cleaned_data.get("user") #注册人的名字

            #要生成一条用户纪录 
            user = form.cleaned_data.get("user") #print(“user”，user)
            pwd = form.cleaned_data.get("pwd")
            email = form.cleaned_data.get("email")
            avatar_obj = request.FILES.get("avatar")
            user_obj = UserInfo.objects.create_user(username = user, password = pwd, email = email, avatar = avatar_obj)

        else:
            print(form.cleaned_data)  #干净数据
            print(form.errors)        #错误数据
            response["msg"] = form.errors  #失败了之后把这所有的错误信息放到msg里边
        return JsonResponse(response)
    form = UserForm()
    return render(request,"register.html", {"form":form})

5. Media配置之MEDIA_ROOT

Django有两种静态文件：

　　/static/ 　　：js，css，img

　　/media/ 　　：用户上传文件；  用户默认头像图片应该在media/avatar里边存一份。

class UserInfo(AbstractUser): 
    '''用户信息'''
    nid = models.AutoField(primary_key=True)
    telephone = models.CharField(max_length=11, null=True, unique=True)
    avatar = models.FileField(upload_to='avatars/', default="/avatars/default.png")

avatar_obj = request.FILES.get("avatar")
user_obj = UserInfo.objects.create_user(username = user, password = pwd, email = email, avatar = avatar_obj)

用户一旦配置了

MEDIA_ROOT = os.path.join(BASE_DIR, "media") 这个路径（在settings里边）

Django会实现：
　　会将文件对象下载到MEDIA_ROOT中avatars文件夹中（如果没有avatar文件夹，Django会自动创建），user_obj的avatar存的是文件的相对路径。

settings.py

STATIC_URL = '/static/'

STATICFILES_DIRS = [
    os.path.join(BASE_DIR,"static")
]

MEDIA_ROOT = os.path.join(BASE_DIR, "media")

views.py

def register(request):
    '''
    #把下面打印的注释应该写在这里边来
    :param request:
    :return:
    '''
    if request.is_ajax():  # 你点击那个按钮即使Ajax请求又是post请求。既可以用Ajax也可用method=post作分支判断
        # print(request.POST) #把所有提交的数据都取出来
        form = UserForm(request.POST)  # 用UserForm做检验，
        response = {"user": None, "msg": None}  # 发Ajax一般都会返回一个字典来进行标示这些行为
        if form.is_valid():  # 数据全通过,成功
            response["user"] = form.cleaned_data.get("user")  # 注册人的名字

            # 生成一条用户纪录
            user = form.cleaned_data.get("user")
            # print("user", user)
            pwd = form.cleaned_data.get("pwd")
            email = form.cleaned_data.get("email")
            avatar_obj = request.FILES.get("avatar")
            extra = {}  # 代码的优化，使用字典
            if avatar_obj:
                extra["avatar"] = avatar_obj
            UserInfo.objects.create_user(username=user, password=pwd, email=email, **extra)
            # if avatar_obj: #如果上传了头像  ---->>  else是没有上传 就是默认头像了。
            #     user_obj = UserInfo.objects.create_user(username = user, password = pwd, email = email, avatar = avatar_obj)
            # else:
            #     user_obj = UserInfo.objects.create_user(username = user, password = pwd, email = email)
        else:
            print(form.cleaned_data)  # 干净数据
            print(form.errors)  # 错误数据
            response["msg"] = form.errors  # 失败了之后把这所有的错误信息放到msg里边
        return JsonResponse(response)
    form = UserForm()
    return render(request, "register.html", {"form": form})

6. Media配置之MEDIA_URL

访问http://127.0.0.1:8000/static/blog/img/default.png是可以直接访问到的，如果是http://127.0.0.1:8000/blog/views.py/是访问不到的，不能把你的源代码暴露出来啊，static里边的无所谓，而static是Django给你配置好的，应该让用户看到。同样的media里边应该也让用户看到。　　浏览器如何能直接访问到media中的数据呢？

settings.py

MEDIA_URL = '/media/'

#与用户上传相关的配置
MEDIA_ROOT = os.path.join(BASE_DIR, "media")
MEDIA_URL = '/media/'

urls.py

#media配置
re_path(r"media/(?P<path>.*)$", serve, {"document_root":settings.MEDIA_ROOT})

浏览器访问http://127.0.0.1:8000/media/avatars/11.jpg可以直接访问media里边的文件了

注意规范问题：