前端:vue3+ts,后端:koa2+jwt,实现登陆功能(后端部分下篇)

简介: 前端:vue3+ts,后端:koa2+jwt,实现登陆功能(后端部分下篇)

1. 在routes里面,创建一个user.js文件,用作登陆的后端文件



/**
 * 用户管理模块
 */
const router = require('koa-router')()  // koa路由文件
const User = require('../models/userSchema')  // schema文件 定义user用户的字段的
const util = require('../utils/util')  // 引入请求成功与否的封装
const jwt = require('jsonwebtoken')  // 引入jsonwebtoken做token的加密
// 二级路由前缀定义
router.prefix('/users')
// 用户的登录
router.post('/login', async (ctx) => {
  try {
      // get请求是ctx.request.query
      // post请求是ctx.request.body
      const { username, password } = ctx.request.body
      /**
       * 返回数据库指定字段, 有三种方式
       * 1. 'userId username userEmail state role deptId roleList'    // 选择只返回的字段
       * 2. { userId: 1, _id: 0 }                                     // 选择只返回的字段, 1是展示, 0是不展示
       * 3. selec('userId')                                           // 查找userId
       */
      const res = await User.findOne({
          username,
          password
        }, 'userId userame userEmail state role deptId roleList')
      const data = res._doc##
      // 利用jsonwebtoken生成基于密钥xiaohe的token
      const token = jwt.sign({
        data,
      }, 'xiaohe', { expiresIn: '2d' })
      // 当查找到数据的时候,返回token和成功
      if(res) {
        data.token = token
        ctx.body = util.success(data)
      } else {
        ctx.body = util.fail('账号或密码不正确')
      }
  } catch (error) {
    //   console.log(error)
      ctx.body = util.fail(error.msg)
  }
})
复制代码


2. 挂载一下到app.js里面



const Koa = require('koa')
const app = new Koa()
const views = require('koa-views')
const json = require('koa-json')
const onerror = require('koa-onerror')
const bodyparser = require('koa-bodyparser')
const logger = require('koa-logger')
const koajwt = require('koa-jwt')    // 引入koa-jwt,用于解密
const users = require('./routes/users') // 引入users文件
const log4js = require('./utils/log4j') // 引入日志系统
const router = require('koa-router')() // 引入路由跳转
const util = require('./utils/util')  // 引入状态吗
// error handler
onerror(app)
// 使用db连接数据库
require('./config/db')
// middlewares
app.use(bodyparser({
  enableTypes:['json', 'form', 'text']
}))
app.use(json())
app.use(logger())
app.use(require('koa-static')(__dirname + '/public'))
app.use(views(__dirname + '/views', {
  extension: 'pug'
}))
// logger   中间件
app.use(async (ctx, next) => {
  log4js.info(`get: ${ JSON.stringify(ctx.request.query) }`)
  log4js.info(`params: ${ JSON.stringify(ctx.request.body) }`)
  // 当状态码是401的时候,改成200,并展示token认证失败
  await next().catch(err => {
    if(err.status == '401') {
      ctx.status = 200
      ctx.body = util.fail('Token认证失败', util.CODE.AUTH_ERROR)
    } else throw err
  })
})
// koa的jwt校验, secret: 密钥   unless: 过滤掉不需要校验的api
app.use(koajwt({ secret: 'xiaohe' }).unless({
  path: [/^\/api\/users\/login/]
}))  // 密钥校验,jwt校验
router.prefix('/api')  // api前缀
// 挂载users上路由
router.use(users.routes(), users.allowedMethods())
// routes
app.use(router.routes(), router.allowedMethods())
// error-handling
app.on('error', (err, ctx) => {
  // console.error('server error', err, ctx)
  log4js.error(`${ err.stack }`)
});
module.exports = app


相关文章
|
7月前
|
JavaScript 前端开发 Java
制造业ERP源码,工厂ERP管理系统,前端框架:Vue,后端框架:SpringBoot
这是一套基于SpringBoot+Vue技术栈开发的ERP企业管理系统,采用Java语言与vscode工具。系统涵盖采购/销售、出入库、生产、品质管理等功能,整合客户与供应商数据,支持在线协同和业务全流程管控。同时提供主数据管理、权限控制、工作流审批、报表自定义及打印、在线报表开发和自定义表单功能,助力企业实现高效自动化管理,并通过UniAPP实现移动端支持,满足多场景应用需求。
646 1
|
3月前
|
存储 前端开发 安全
实现“永久登录”:针对蜻蜓Q系统的用户体验优化方案(前端uni-app+后端Laravel详解)-优雅草卓伊凡
实现“永久登录”:针对蜻蜓Q系统的用户体验优化方案(前端uni-app+后端Laravel详解)-优雅草卓伊凡
202 5
|
8月前
|
前端开发 Java 物联网
智慧班牌源码,采用Java + Spring Boot后端框架,搭配Vue2前端技术,支持SaaS云部署
智慧班牌系统是一款基于信息化与物联网技术的校园管理工具,集成电子屏显示、人脸识别及数据交互功能,实现班级信息展示、智能考勤与家校互通。系统采用Java + Spring Boot后端框架,搭配Vue2前端技术,支持SaaS云部署与私有化定制。核心功能涵盖信息发布、考勤管理、教务处理及数据分析,助力校园文化建设与教学优化。其综合性和可扩展性有效打破数据孤岛,提升交互体验并降低管理成本,适用于日常教学、考试管理和应急场景,为智慧校园建设提供全面解决方案。
506 70
|
9月前
|
JSON 自然语言处理 前端开发
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
475 72
【01】对APP进行语言包功能开发-APP自动识别地区ip后分配对应的语言功能复杂吗?-成熟app项目语言包功能定制开发-前端以uniapp-基于vue.js后端以laravel基于php为例项目实战-优雅草卓伊凡
|
7月前
|
存储 消息中间件 前端开发
PHP后端与uni-app前端协同的校园圈子系统:校园社交场景的跨端开发实践
校园圈子系统校园论坛小程序采用uni-app前端框架,支持多端运行,结合PHP后端(如ThinkPHP/Laravel),实现用户认证、社交关系管理、动态发布与实时聊天功能。前端通过组件化开发和uni.request与后端交互,后端提供RESTful API处理业务逻辑并存储数据于MySQL。同时引入Redis缓存热点数据,RabbitMQ处理异步任务,优化系统性能。核心功能包括JWT身份验证、好友系统、WebSocket实时聊天及活动管理,确保高效稳定的用户体验。
433 4
PHP后端与uni-app前端协同的校园圈子系统:校园社交场景的跨端开发实践
|
6月前
|
自然语言处理 JavaScript 前端开发
一夜获千星!已获 1.7k+,Art Design Pro:Vue3 + Vite + TypeScript 打造的高颜值管理系统模板,这个让后端小哥直呼救命的后台系统
Art Design Pro 是一款基于 Vue 3、Vite 和 TypeScript 的高颜值后台管理系统模板,已获 1.7k+ 星标。项目专注于用户体验与视觉设计,支持主题切换、多语言、权限管理及图表展示等功能,内置常用业务组件,便于快速搭建现代化管理界面。其技术栈先进,开发体验流畅,适配多设备,满足企业级应用需求。项目地址:[GitHub](https://github.com/Daymychen/art-design-pro)。
1000 11
|
6月前
|
人工智能 监控 前端开发
AI工具:前端与后端的终极对决?谁将成为新时代的宠儿?
深入探讨AI工具对前端和后端开发的具体影响、各自的机遇与挑战,并分析未来开发者如何驾驭AI,实现能力跃迁。
305 0
|
9月前
|
前端开发 算法 NoSQL
前端uin后端php社交软件源码,快速构建属于你的交友平台
这是一款功能全面的社交软件解决方案,覆盖多种场景需求。支持即时通讯(一对一聊天、群聊、文件传输、语音/视频通话)、内容动态(发布、点赞、评论)以及红包模块(接入支付宝、微信等第三方支付)。系统采用前后端分离架构,前端基于 UniApp,后端使用 PHP 框架(如 Laravel/Symfony),配合 MySQL/Redis 和自建 Socket 服务实现高效实时通信。提供用户认证(JWT 集成)、智能匹配算法等功能,助力快速上线,显著节约开发成本。
268 1
前端uin后端php社交软件源码,快速构建属于你的交友平台
|
8月前
|
人工智能 缓存 Java
用 AI 搭建秒杀平台后端,一周搞定所有功能(附超详细踩坑记录)
本文分享如何借助AI技术快速搭建电商秒杀平台后端。通过飞算JavaAI,从需求分析到代码生成全流程智能化,大幅提高开发效率。文章详细记录了技术栈选择(Java、Spring Boot、MySQL、Redis)、系统架构设计、缓存机制优化、数据一致性保障及测试调优等环节,解决高并发难题,助开发者高效完成秒杀平台构建并规避常见坑点。
|
8月前
|
监控 前端开发 小程序
陪练,代练,护航,代打小程序源码/前端UNIAPP-VUE2.0开发 后端Thinkphp6管理/具备家政服务的综合型平台
这款APP通过技术创新,将代练、家政、娱乐社交等场景融合,打造“全能型生活服务生态圈”。以代练为切入点,提供模块化代码支持快速搭建平台,结合智能匹配与技能审核机制,拓展家政服务和商业管理功能。技术架构具备高安全性和扩展性,支持多业务复用,如押金冻结、录屏监控等功能跨领域应用。商业模式多元,包括交易抽成、增值服务及广告联名,同时设计跨领域积分体系提升用户粘性,实现生态共生与B端赋能。
775 12

热门文章

最新文章

  • 1
    我尝试了所有后端框架 — — 这就是为什么只有 Spring Boot 幸存下来
  • 2
    前端如何存储数据:Cookie、LocalStorage 与 SessionStorage 全面解析
  • 3
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(五):背景属性;float浮动和position定位;详细分析相对、绝对、固定三种定位方式;使用浮动并清除浮动副作用
  • 4
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(六):全方面分析css的Flex布局,从纵、横两个坐标开始进行居中、两端等元素分布模式;刨析元素间隔、排序模式等
  • 5
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(一):CSS发展史;CSS样式表的引入;CSS选择器使用,附带案例介绍
  • 6
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
  • 7
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(九):强势分析Animation动画各类参数;从播放时间、播放方式、播放次数、播放方向、播放状态等多个方面,完全了解CSS3 Animation
  • 8
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(二):CSS伪类:UI伪类、结构化伪类;通过伪类获得子元素的第n个元素;创建一个伪元素展示在页面中;获得最后一个元素;处理聚焦元素的样式
  • 9
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(四):元素盒子模型;详细分析边框属性、盒子外边距
  • 10
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(七):学习ransform属性;本文学习 rotate旋转、scale缩放、skew扭曲、tanslate移动、matrix矩阵 多个参数