路由的配置和前往登录首页进行发送请求

后台创建了,但是还没有配置路由,进行配置路由

一:后台:

配置路由

在根目录下创建一个文件夹routers.js,在创建一个index.js(这个是路由

1:引入express

2:获取路由对象

在app.js引入的这个路由文件,在使用一下,然后用nodemon app启动一下这个后台看能否获取到成功之后在测试接口

测试接口:在浏览器中输入locallhost:3002能够获取到路由输出的(测试成功的字样)

路由已经配置好了,然后进行后端服务的登录功能

二:后台

这时候数据库已经有了,数据库里面没有数据,然后我要在数据库里面创建一个表,然后有一些自断

首先在后台创建一个models文件夹,然后再创建一个usermoudel.js文件

里面需要引入mongoose,然后还需要md5加密 引用md5。

然后进行定义表的结构,   然后再看怎么创建表,创建表的同时也要配置一个超级管理员,,最后,导出这个表,然后再router  index.js里面引用这个导出的表,然后把这个表在/login这个地址上显示出来,通过结构赋值-然后在判断是否成功登录。

 我到这就获取到了用户名和用户信息,现在就要看登录成功或者失败了,然后就要看接口文档了

为什么要使用findone查询,而不用find

比如说用户名和密码,我去一条条查用findone我会找到同时满足的,find会把不是一条的用户名和密码返回给你,不好。

查询完了之后,我要看是否登陆成功,根据拿到的用户名或者密码,去数据库进行查询

到这后台服务完全搭建成功,既然他已经登录成功了,现在就可以通过前台来请求后端接口,如果登录成功我就让他去首页。

三:前台:

1:在前台api文件夹创建一个longin.js

里面引入axios对象,然后再导出登陆方法,然后再终端打开文件夹,因为我们要获取完用户信息之后,存到localstage之中,之前都是localstage...什么的,存对象要手动转换成字符串,安装一个npm install -s -store  类库,操作起来就方便了许多。

2:我们要把用户信息存放到内存当中,所以再util里面创建个memonyUtils.js文件,专门用来判断用户是否登陆过。{这部主要是把本地存储和判断拆开}

要把用户信息存到内存当中,所以我们要在utils下新建一个文件memonyUtils  专门用来判断这个用户是否登录过,创建一个storageUtils文件夹进行本地存储把本地存储和判断的文件进行拆分。

接下来就要利用vuex来发送请求

3:在store下创建一个moudules,在moudules里面创建user.js里面创建各种模块

user.js里面首先引入文件  引入api目录下的login.js(里面写的是登录的方法),引入之后在state里面先放一个空对象,然后再mutations里面接收一下state,还有一个需要传递的参数,进行给stste里面的user赋值,然后通过actions会接受一个commit方法,还有这个传进来的data,然后给user,password进行解构赋值,然后因为这个login(username,password)是promise对象,所以可以用asyns和await

{

先暂停,问?为什么判断是promise对象?Promise 简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。

}

4:然后先输出一下这个resullt,看下这个是什么

 然后要在store下面引入一下这个modules下面的user.js,然后再仓库里用一下moudles{user}  把user放进去,导出user。

5:在登录组件index.js当中,在表单校验成功的时候进行,进行发送,通过这个this.$store.dishpatch去触发actions方法,这时候输入admin是可以获取到data的用户名和密码

6:接下来进行判断,先利用mapstate把user.js进行映射能拿到里面state里面的user这个对象

this.user.user这个数据存在那么登录成功了,就给memoneyUtils里面user进行赋值(因为我们后面要进行判断这个用户是否登陆过,并且在上方引入这个memonyUtils模块),成功登录了就让他回到登陆首页。

 以前操作都是用.getter

安装store插件就是一个操作localstage的一个类库,里面有一些方法操作起来比较方便

在utils新建一个storageUtils文件  在里面引入store

在这里定义一个key  值 为 bo344_user_key

这样我setitem  和getitem就用这一个key   修改的时候就改b0344就可以了

现在想什么问题?

刷新页面让他还是登录页面,关闭浏览器在打开还是已经登录的状态。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

我叫LiLi

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值