路飞学城项目

1.先从前端Vue看起

vue-router，进入到主页Home.vue

vue-roter

1.mode使用history模式
2.输入'/'重定向到'/home',然后进入到Home组件
3.linkActiveClass:'is-active'//表明连接是否被选中‘is-active’是一个css
4.router-link即跳转页面用  
    静态指定： :to=“/home”
    命名路由：<router-link :to='{name:home}'>//有点类似于别名
5.$router.push({name:'Course'})相当于到哪个页面（推到/course路由）
6.导航守卫router.beforeEach(）

Luffy-Header

1.首先进入header页面  

Login

1.ajax进行登录验证
2.登录成功
    this.$router.go(-1)返回上一个组件
    使用localStorage，进行存储
    
    
登录的流程是：
1.首先进入Login vue 全局钩子执行GEE的捕捉，从GEE拿到一个验证字符
2.拿到成功之后将校验的数据赋值给validateResult进行二次ajax登录验证！！！
3.发送ajax进行后端验证
    1.后端先校验验证码通过后
    2.在进行数据库的用户校验并更新token
    3.校验成功localStorage缓存到本地
    4.再去设置vuex store进行全局状态的设置
    5.全局是拿userinfo的token进行校验，比如有的话显示用户的下拉菜单
4.只有登录之后才会显示下拉框

logout
1.清除本地的localstorage
2.执行dispatch方法将userino置为空
3.router.push回到home页面

Home

1.主要是轮播图的展示
2.使用element-ui的走马灯
3.使用了v-for

my_order

0.进行全局守卫的校验要求auth
0.5.进行state getuserInfo 进行user 赋值
1.进入我的订单页面（myroder组件）
2.初始化我的订单页面
3.到后端需要进行token校验
    用到缓存
4.go_pay 用到阿里支付 pip install Crypto

Course列表

1.都是通过异步加载进来的

#进入到购物车CART
1.整个购物车的增删改查是redis的操作
2.删除操作使用到了this.$confirm
3.加载购物车loading

购物车有点小bug，价格不能随着修改而修改

acount结算

1.

后端总结

1.购物车是对Redis的增删查
2.使用抛出异常的方式返回code和msg（BaseResponse）
class CommonException(Exception):
    def __init__(self, code, msg):
        self.error = msg
        self.code = code
class BaseResponse(object):
    def __init__(self):
        self.code = 1000
        self.msg = ""
        self.data = None

    @property
    def dict(self):
        return self.__dict__
3.登录的验证码使用GEETEST
    先进性验证码的校验
    再进行用户的数据库校验
    成功之后进行Token的设置（前端全局的校验）
4.CORS校验即OPTIONS
5.ApiPay的使用
6.DRF中authentication_classes，permission_classes（注销用户）的使用
7.TOken的全局验证(账单，结算，支付，购物车)

Vue总结

1.vuex的使用 userinfo的使用
2.vue-router的使用
3.element-ui的使用
4.axios的使用