1 jwt:json web token
-一种认证方式，区别session，生成三段
-头.荷载.签名，给前端，前端再发请求，需要携带
-头.荷载再用同样的加密方式加密跟签名比较，如果一样，说明token可用
-解析出我需要的东西（荷载中）
-如果不一样，说明被篡改了，不可使用
-荷载中加入过期时间
2 使用jwt的开发流程
-用户表，写一个登录功能，登录成功，签发一个token，返回给前端
-以后前端访问，都要携带这个token串
-进入我的认证类（drf，中间件），取出token，认证，认证通过，反解出当前登录用户
-以后再视图类中使用，request.user就是当前登录用户
3 djangorestframework-jwt
-已经写好了登录功能：加一个路由，映射到它写的视图类
-已经写好了认证类：配置在视图类中，需要跟权限类配合使用
-修改登录返回的格式
-jwt有很多配置文件：过期时间
-自己写（签发token，验证token）
1 多方式登录
视图
from rest_framework.generics import CreateAPIView
from app01 import models
from app01 import serializer
from rest_framework.response import Response
from rest_framework.viewsets import ViewSetMixin
# class UserLogin(CreateAPIView): # 需要自己配路径
class UserLogin(ViewSetMixin,CreateAPIView): # 自动生成路由
queryset = models.UserInfo.objects.all()
serializer_class = serializer.UserInfoModelSerializer
def create(self, request, *args, **kwargs):
# context是上下文，是视图类和序列化类沟通的桥梁
ser = self.get_serializer(data=request.data)
if ser.is_valid():
token = ser.context['token']
username = ser.context['username']
return Response({'status': 100, 'msg': '登录成功', 'token': token, 'username': username})
else:
print(ser.errors)
return Response({'status': 100, 'msg': '用户名或密码错误'})
序列化类
class UserInfoModelSerializer(serializers.ModelSerializer):
# 这么写，字段没有自己的校验规则了
username = serializers.CharField()
class Meta:
model = models.UserInfo
fields = ['username', 'password']
def validate(self, attrs):
username = attrs.get('username')
password = attrs.get('password')
# 多方式登录，username有可能是手机号，邮箱，用户名
if re.match('^1[3-9][0-9]{9}$', username):
# 用手机号登录
user = models.UserInfo.objects.filter(phone=username).first()
elif re.match(r'^.+@.+$', username):
# 以邮箱登录
user = models.UserInfo.objects.filter(email=username).first()
else:
# 以用户名登录
user = models.UserInfo.objects.filter(username=username).first()
if user and user.check_password(password):
# 登录成，签发token
payload = jwt_payload_handler(user)
token = jwt_encode_handler(payload)
self.context['token'] = token
self.context['username'] = user.username
return attrs
else:
# 校验不通过
raise ValidationError('用户名或密码错误')
2 前端现状和Vue介绍
1 前后端混合开发（前端调好页面---》给后端，加模板语言）
2 ajax：js跟后端交互，js从后端请求数据，js的dom操作渲染页面，前后端分离的雏形
3 Angular框架的出现--js框架：前端工程化
4 React、Vue框架：中国人中小型项目用Vue多，老外用React
5 大前端的概念：
-网站，ios，安卓，小程序
6 谷歌：flutter框架，安卓，ios，无缝运行，桌面开发
-Dart：语言，java很像
7 uni-app:使用vue写---》编译成ios，安卓，网站的（初创型公司）
8 在不久的将来 ，大前端框架可能会一统天下
Vue：渐进式框架（前端项目中一部分使用，整个项目都使用，就是一个前端项目）
超快虚拟 DOM
vue:1.x 2.x(用的最多) 3.x
3 MVVM架构
1 M(数据层)----V(页面展示)----VM（vm）
2 双向数据绑定：JS中变量变了，HTML中数据也跟着改变
4 单页面开发和组件化开发
1 类似于DTL中的include，每一个组件的内容都可以被替换和复用
2 只需要1个页面，结合组件化开发来替换页面中的内容
页面的切换只是组件的替换，页面还是只有1个index.html
5 nodejs介绍
1 javascript:只能运行在浏览器中，解释型语言，浏览器里有它的解释器
2 谷歌的V8引擎，抠出来，运行在操作系统之上，c写了一些底层包
3 nodejs：解释器，写javascript的代码
4 前端工程师，不用学后端语言，只会js，就可以写后端了
5 node：python，
6 npm：pip3，用来安装第三方包
## 前端开发的ide
-webstorm
-vscode
-hbuilder
-sublinetext
## 咱们用pycharm
-webstorm和pycharm是一家，只需要装vue插件
6 模板语法
{{}}
7 指令
v-text
v-html
v-if
v-show
v-on:缩写成@