手机号注册验证接口
user.py——>urls.py
添加路由：
path('mobile/', views.MobileCheckAPIView.as_view()),
在views.py
手机号码验证是否注册了
首先获取手机号
如果不存在，提示mobile必须提供
如果格式错误，提示mobile格式有误
获取数据库中的mobile，如果相等，手机号已注册
否则，手机号未注册
注册接口
views.py
手机号验证码注册
发送post请求
转到views，
1、将请求的携带的数据丢给data，然后丢给序列化类（序列化字段）
serializer = serializers.RegisterMobileModelSerializer(data=request.data)
2、如果校验通过
serializer.is_valid(raise_exception=True)
3、保存产生对象到user_obj对象中
user_obj = serializer.save()
4、返回序列化结果（反序列化结果）
return APIResponse(results=serializers.RegisterMobileModelSerializer(user_obj).data)
参与 序列化的字段（用户名，手机号，邮箱）
参与 反序列化的字段（手机号，密码，验证码）
来到serializers.py中
class RegisterMobileModelSerializer(serializers.ModelSerializer):
先写反序列化的字段，因为没有code字段，需要自己定义
code = serializers.CharField(write_only=True, min_length=6, max_length=6)
class Meta:
model = models.User
fields = ('username', 'mobile', 'password', 'code')
序列化反序列化参数：是否是序列化反序列化
extra_kwargs = {
'password': {
'write_only': True
},
'username': {
'read_only': True
}
}
提示下面的代码：每一个反序列化字段都可以配置一个局部钩子
定义mobile（手机号）局部钩子，校验格式
如果输入的手机号格式错误，提示手机号格式有误
def validate_mobile(self, value):
if not re.match(r'^1[3-9][0-9]{9}$', value):
raise serializers.ValidationError('手机号格式有误')
return value
定义code（验证码）局部钩子
强转value验证码值，返回值，如果抛出错误，返回验证码有误
def validate_code(self, value):
try:
int(value)
return value
except:
raise serializers.ValidationError('验证码有误')
然后进行全局校验
1）一个序列化类存在一个全局钩子可以对所有字段进行全局校验，钩子方法 validate(self, 所有字段值字典attrs)
规则：成功直接返回attrs，失败抛出校验失败信息ValidationError({'异常字段', '错误信息'})
2）重写create方法实现增入库，返回入库成功的对象
def validate(self, attrs):
# 所有字段值字典 attrs
mobile = attrs.get('mobile')
# 必须拿出字典attrs中的code（验证码），和下面的缓存code进行校验
code = attrs.pop('code')
# 短信验证码缓存key，就是old_code（SMS_CACHE_FORMAT）
old_code = cache.get(settings.SMS_CACHE_FORMAT % mobile)
# 如果不相等
if code != old_code:
# 抛出错误，验证码有误
raise serializers.ValidationError({'code': '验证码有误'})
验证码校验通过，验证码失效，使用一次失效，为了验证码信息安全考虑
cache.set(settings.SMS_CACHE_FORMAT % mobile, None, 0)
创建用户需要一些额外的信息，比如username，邮箱（可以多方式登录）
attrs['username'] = mobile
return attrs
然后就是重写create方法：默认入库，默认密码是明文，重写后就是密文了，因为create方法是auth组件的
def create(self, validated_data):
return models.User.objects.create_user(**validated_data)
避免主页横向滚动条
到前端的全局css样式文件中添加，避免横向产生滚动条的配置
body {
overflow: hidden;
}
登录模态框
在components新建Login.vue
配置style，渲染login组件
在登录按钮中绑定方法，
绑定密码登陆和短信验证登陆事件
如果登录方式是is_pwd
可以使用用户名，手机号，邮箱
在mothods中，写显示模态框代码
登录按钮中添加关闭登录事件
Header.vue中的methods：中的is_login改成False（这里的is_login在父级中）
Login.vue中mothods中的close_login()
利用子传参，发送close事件
在Header.vue中的父级中，绑定close事件
把值改为False，然后复制粘贴模态框代码
获取验证码，获取后设置false
校验手机对应用户是否存在
前台校验手机格式，如果有误提示手机号有误
设置显示模态框的显示时间为1秒，单位是1000=1s
访问后台校验手机号对应用户是否存在
注册过的手机才允许发送验证码
this.is_send = true;
发送中..
验证码倒计时设置
获取验证码
重新回复点击发送给功能的条件
到0秒后重新发送
验证码发送成功
验证码发送失败
获取验证码异常
验证码登录
要将相应的用户信息和token存储到cookies中
弹出框提示后，关闭登录界面
登录成功，如果异常，就是登录失败
密码登录，要将响应的用户信息和token存储到cookies中
弹出框提示后，关闭登录界面
异常就是登录失败
style scoped中设置布局
可以完成前台登录手机校验，获取验证码，
前台密码登录，注销，注册多个请求。
后台验证码处理一次性使用
设置配置文件中的三大认证模块
拥有具体权限限制的视图类局部配置权限
拥有具体频率限制的视图类局部配置频率
频率限制scope的规则
在serializer文件中添加代码
在全局钩子中设置def validate(self, attrs):
验证码校验通过，验证码失败（验证码一次性使用）
在实际项目中一般需要设置一次性使用的验证码（为了提高验证码的安全）
