基于Vue2.6+iView4.5的后台管理系统方案示例。目前实现的功能和组件用到的Vue页面：iView4.5文章列表，文章分类用户列表，用户注册富文本框：quillEditor文件上传：使用iView自带的文件上传组件axios项目地址使用githttps://github。com/shanyanwt/koa_vue_blog.gitnpminstall//安装依赖npmrundev//本地开发npmrunbuild//生产部署目录结构└─src│App.vue//入口文件│main.js│├─api//api│├─common//工具类│├─components//组件│countUp.vue//数字滚动组件│uploadImg.vue//压缩Graph组件│├─filter//filter│dateFilter.js│├─router//路由│index.js│router.js│├─static//静态文件│├─template//打包模板│index.ejs│├─vendors//封装模板│└─view│about.vue//关于我们│articleList.vue//文章列表│main.vue//入口│rtf.vue//编辑文章│user.vue//用户列表├─index//首页│└─login//登录页面用户登录示例使用cryptoMD5加密//引入上面打包的utils.jsimportutilsfrom'../utils.js'letname='abcd'letpassword='123'letuser_ticket=utils.md5(utils.md5(name+utils.md5(password)))console.log(user_ticket)=>3a59492a85438a3a39a30fd0d8103ac5//加密结果//MD5加盐登录letname='abcd'letpassword='123'vartimestamp=Date.parse(newDate())/1000letuser_ticket=utils.md5(utils.md5(utils.md5(name+utils.md5(password)))+timestamp)console.log(user_ticket)=>0b3298cb3c20b08318c185aec803a929//加盐的结果//服务器将加密后的密文与数据库进行比对vartimestamp=Date.parse(newDate())/1000让user_ticket=utils.md5(utils.md5((utils.md5((this.formInline.user).toLowerCase()+utils.md5(this.formInline.password))).toLowerCase())+timestamp)axios({method:'post',url:api.API.admin_login,data:{'user_ticket':user_ticket,'name':this.formInline.user,'timestamp':timestamp}}).then(res=>{如果(res.error_code==consts.ERROR_CODE.SUCCESS){this.$Notice.success({title:'登录成功！',});letuserInfo=JSON.stringify(res.result_data)cacheUtils.localStorage(consts.USERINFO).set(consts.USERINFO,userInfo)this.$router.push('/home');}elseif(res.error_code==consts.ERROR_CODE.USERNAME_OR_PASS_ERRROR){this.$Notice.error({title:'用户名密码错误！'});}else{this.$Notice.error({title:'服务器超载，稍后重试！'});}}).catch(err=>{this.$Notice.error({title:'服务器人满为患，稍后再试！'});})管理端通过router的beforeEach检查用户是否登录router.beforeEach((to,from,next)=>{letuserInfo=cacheUtils.localStorage(consts.USERINFO).get(consts.USERINFO)if(!userInfo&&to.name!='login'){//判断是否登录并进入登录页面next({name:'login'});}elseif(userInfo&&to.name=='index'){next({name:'home'});}else{next();//登录后继续往下执行}});MD5盐解密案例https://segmentfault.com/a/11...愿你保持独立思考，不卑不亢，不骄不躁，努力成长为自己喜欢的样子。我是一只孤独的狼...欢迎star
