计算机专业毕业设计项目推荐08-英语在线点读平台（SpringBoot+Vue+MongoDB）

news2025/1/11 2:27:03

英语在线点读平台（SpringBoot+Vue+MongoDB）

- **介绍**
- **系统总体开发情况-功能模块**
- **各部分模块实现**

介绍

本系列(后期可能博主会统一为专栏)博文献给即将毕业的计算机专业同学们,因为博主自身本科和硕士也是科班出生,所以也比较了解计算机专业的毕业设计流程以及模式，在编写的过程中可以说几乎是参照毕业设计目录样式来进行的.
博主分享的基本都是自己接触过的项目Demo，整理了一下自己做过的项目，将可以作为毕业设计的项目分享给大家。（注：项目基本都是博主自己用过的，所以不存在远古代码无法使用）

系列的文章后端都是采用Java或者Go语言，前端主要是采用的原生Js和Vue框架搭建的。数据都是采用Mysql。还有较少的微信小程序开发。开发工具这些可以自己选择，我分享一下自己的Go语言开发我用的Vscode，前端用的HBuilder X,测试接口Postman，Java开发用的IDEA。数据库查看用的navicat，上传服务器Xshell 7和Xftp 7。

系统总体开发情况-功能模块

英语在线点读平台分为英语在线点读平台前端和后台管理系统。
英语在线点读平台用户的角色一共分为三种：游客、普通用户和管理员。不同的角色分别对应不同的操作权限。
该系统主要分为内容显示模块、路由跳转模块、音频播放模块、搜索模块、用户注册登录模块、用户收藏模块、点赞模块、评论模块、后台管理模块。
系统模块图
在这里插入图片描述

各部分模块实现

在这里插入图片描述

export function login({username,password}) {
    if(!username || !password) {
        message.error('用户名密码必须输入');
        return errorMsg('用户名密码必须输入')
    }
    return dispatch=>{
		axios.post('/user/login',{username,password})
			.then(res=>{
				if (res.status===200&&res.data.code===0) {
					// dispatch(registerSuccess({user,pwd,type}))
                    dispatch(authSuccess(res.data.data))
                    message.success(res.data.success);
				}else{
                    dispatch(errorMsg(res.data.msg))
                    message.error(res.data.msg);
				}
			})		
	}
}

   Router.post('/login', function (req, res) {
    const { username, password } = req.body;
    User.findOne({username,password:md5Pwd(password)},{'password':0},function (err, doc) {
        if(!doc) {
            return res.json({msg:'用户名或密码错误'})
        }
        //用cookie保存用户的ID来保持刷新页面时用户登录状态
        res.cookie('userid', doc._id)
        return res.json({code: 0,data: doc, success:'登录成功'})
    })
})