登录/退出功能

1. 登录业务流程：

1. 在登录页面输入用户名和密码
2. 调用后台接口进行验证
3. 通过身份验证，跳转到项目主页

2. 登录状态保持:

HTTP是无状态协议。所谓无状态是指协议对于事务处理没有记忆功能，对于同一个URL请求没有上下文关系，每次的请求都是独立的，服务器没有保存客户端的状态。可以通过cookie、session和token来保持用户状态。

1. 如果服务器和客户端同源，使用cookie或session保持登录状态。cookie在客户端记录状态，session在服务器端记录状态。
2. 如果服务器和客户端跨域，使用token来维护登录状态

3. 登录原理分析（token）:

用户在登录页面输入账号和密码，客户端将输入的数据发送给服务器，服务器返回登录结果，登录成功返回带有token的数据，客户端得到token并保存，后续的请求都需要带上这个token发送给服务器，服务器会验证token以保证用户身份。

(1). 登录代码：

login(){
        this.$refs.loginFormRef.validate(async valid=>{
            if(!valid){
                return;
            }
            const {data: res} = await this.$http.post('login',this.loginForm);
            console.log({data: res});
            if(res.meta.status !== 200){
                return this.$message.error('登录失败！')
            }
            this.$message.success('登陆成功')
            // 1.登陆成功后的token，保存到客户端的sessionStrorage中
            //   1.1 项目中除了登录之外的其他API接口，必须在登录之后才能访问
            //   1.2 token只在网页打开期间生效，所以将token保存在sessionStrorage中
            window.sessionStorage.setItem('token',res.data.token)
            // 2.通过编程式导航跳到后台主页
            this.$router.push('/home')
        })
    }

4. 退出登录:

销毁本地token即可：

logout() {
      // 销毁token
      window.sessionStorage.clear()
      this.$router.push('/login')
    },