计算机专业毕业设计项目推荐11-博客项目（Go+Vue+Mysql）

一个小肥羊2023-10-07 2:01

博客项目（Go+Vue+Mysql）

介绍

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

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

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

各部分模块实现

今天主要是将后端实现登录效果和改一些前端的代码

前端：

在这里插入图片描述

因为原始代码是将侧边栏写在了App.vue里面，所以我改了一下增加了Sidebar.vue将侧边栏新建了一个文件保存。然后在App.vue里面引用。

在这里插入图片描述


(这也是我的项目哈，俺叫王先生以前的名字)


go 复制代码 
package model

import (
	
	"github.com/dgrijalva/jwt-go"
)


//User表
type User struct {
	Id       int    `json:"id"`
	Username string `json:"username"`
	Password string `json:"password"`
}

// UserLogin 用户登录
func UserLogin(username string) (User,error){
	mod := User{}
	
	err :=Db.Get(&mod, "select * from userlogin where username=? limit 1", username)
	
	return mod,err
}

//UserClaims    token 携带的数据

type UserClaims struct {
	Id       int    `json:"id"`
	Username string `json:"username"`
	Password string `json:"password"`
	
	jwt.StandardClaims
}
go 复制代码 
package route

import (
	// "fmt"
	"github.com/zxysilent/utils"
	"github.com/dgrijalva/jwt-go"
	"blog_go/model"
	"github.com/labstack/echo"
)

// ServerHeader middleware adds a `Server` header to the response.
func ServerHeader(next echo.HandlerFunc) echo.HandlerFunc {
	return func(ctx echo.Context) error {
		ctx.Response().Header().Set(echo.HeaderServer, "Echo/3.0")
	
		
		// fmt.Println(ctx.Response().Header())
		tokenString := ctx.FormValue("token")
		claims := model.UserClaims{}
		
		token, err := jwt.ParseWithClaims(tokenString, &claims, func(token *jwt.Token) (interface{}, error) {
			return []byte("123"), nil
		})

		if err==nil && token.Valid {
			return next(ctx)
		} else {
			return ctx.JSON(utils.ErrToken("验证失败"))
		}
		
	}
}
go 复制代码 
package route

import (

	"github.com/labstack/echo/middleware"
	"blog_go/control"
	"github.com/labstack/echo"
)

func Run(){
	blog := echo.New()
	
	blog.Use(middleware.CORS())
	
	blog.Use(middleware.Logger())
	blog.Use(middleware.Recover())
	//用户登录
	blog.POST("/admin/login", control.UserLogin)
	adm:=blog.Group("/admin",ServerHeader)
	
	blog.GET("/", control.Index)
	
	
	blog.Logger.Fatal(blog.Start(":1323"))
	// blog.Start(":1323")
}
go 复制代码 
package control

import (
	// "fmt"
	"time"
	"github.com/zxysilent/utils"
	"blog_go/model"
	"github.com/dgrijalva/jwt-go"
	"github.com/labstack/echo"
)

type login struct {
	Username string `json:"username"`
	Password string `json:"password"`
}

func UserLogin(ctx echo.Context) error {
	
	ipt := login{}
	err:=ctx.Bind(&ipt)
	if err!=nil{
		return ctx.JSON(utils.ErrIpt("输入有误", err.Error()))
	}
	mod, err :=model.UserLogin(ipt.Username)
	
	if err!=nil {
		return ctx.JSON(utils.ErrIpt("用户名错误", err.Error()))
	}
	if mod.Password !=ipt.Password{
		return ctx.JSON(utils.ErrIpt("密码错误"))
	}
		// Create the UserClaims 生成
	claims := model.UserClaims{
		Id:mod.Id,
		Username:mod.Username,
		Password:mod.Password,

		StandardClaims: jwt.StandardClaims{
			ExpiresAt: time.Now().Add(2*time.Hour).Unix(),
			
		},
	}
	token := jwt.NewWithClaims(jwt.SigningMethodHS256, claims)
		//自己的密钥
	ss, err := token.SignedString([]byte("123"))
	// fmt.Printf("%v %v", ss, err)
	return ctx.JSON(utils.Succ("登录成功", ss))
}	
	
前端写的路由守卫：

```javascript
import Vue from 'vue'
import Router from 'vue-router'

// import Login from '@/view/Login'
Vue.use(Router)

const router = new Router({
	routes: [
		{
			 path: '/',
			 redirect: '/login'
		},
		{
		      path: '/login',
		      
		      component: resolve => require(['@/view/login'], resolve),
			  meta: {
			  	title: '后台登陆'
			  },
		    },

		{
			path: '/organizationManage',
			component: resolve => require(['@/view/index/index'], resolve),
			meta: {
				title: '首页'
			},
			redirect: to => {
			  return '/organizationManage'
			},
			children:[
				{
					path: '/organizationManage',
					component: resolve => require(['@/view/organization_manage/index'], resolve),
					meta: {
						title: '组织管理'
					},
				},
				{
					path: '/staffManage',
					component: resolve => require(['@/view/staff_manage/index'], resolve),
					meta: {
						title: '员工管理'
					},
				},
			],
		},
		{
			path: '/personManage',
			component: resolve => require(['@/view/index/index'], resolve),
			meta: {
				title: '个人管理'
			},
			redirect: to => {
			  return '/personManage'
			},
			children:[
				{
					path: '/personManage',
					component: resolve => require(['@/view/personal/personinformation'], resolve),
					meta: {
						title: '个人管理1'
					},
				},
				// {
				// 	path: '/staffManage',
				// 	component: resolve => require(['@/view/staff_manage/index'], resolve),
				// 	meta: {
				// 		title: '员工管理'
				// 	},
				// },
			],
		},
	]
});

//导航守卫限制页面
// 使用 router.beforeEach 注册一个全局前置守卫，判断用户是否登陆
router.beforeEach((to, from, next) => {
  if (to.path === '/login') {
    next();
  } else {
    let token = localStorage.getItem('token');
 
    if (token === null || token === '') {
      next('/');
    } else {
      next();
    }
  }
});

export default router;




javascript 复制代码 
 async submitForm(formName) {
			  
			 
	        this.$refs[formName].validate(async (valid) => {
	          if (valid) {
				  const res = await useredit({
				  	token: getStore('token'),
					nickname:this.formLabelAlign.nickname,
					email:this.formLabelAlign.email,
					signature:this.formLabelAlign.signature
				  	
				  })
				console.log(res)
					
				if(res.code==200){
					     console.log('submit!');
				}else{
					  console.log("修改失败");
				}
	      
	          } else {
	            console.log('error submit!!');
	            return false;
	          }
	        });
	      },
go 复制代码 
// UserEdit 个人信息修改
func UserEdit(nickname,email,signature,token string) error {
	tx,_ :=Db.Begin()//事务

	result, err :=tx.Exec("update userinformation set `nickname`=?,email=?,signature=? where token=?", nickname,email,signature,token)

	if err!=nil{
		tx.Rollback()
		return err
	}
	rows,_ :=result.RowsAffected()
	if rows<1	{
		tx.Rollback()
		return errors.New("row affecter<1")

	}
	tx.Commit()
	return nil
}

文章管理

后台管理页面：

在这里插入图片描述

编辑删除功能都做啦。当然也少不了新增。

在这里插入图片描述

最后想说的

对项目有任何疑问，或者说想学习项目开发的都可以来问博主哦~。也可以选题，开题指导，论文整体框架或者项目整体开发指导。

计算机专业毕业设计项目(附带有配套源码以及相关论文，有需要的同学可以联系博主，但是不免费哦)。

联系方式

微信号：wxid_rrun0cqao5ny22

相关推荐
qq_172805591 小时前
GO GIN 推荐的库
开发语言·golang·gin
天下无贼！2 小时前
2024年最新版Vue3学习笔记
前端·vue.js·笔记·学习·vue
=(^.^)=哈哈哈2 小时前
Golang如何优雅的退出程序
开发语言·golang·xcode
爱喝水的小鼠2 小时前
Vue3(一) Vite创建Vue3工程，选项式API与组合式API；setup的使用；Vue中的响应式ref，reactive
前端·javascript·vue.js
小晗同学2 小时前
Vue 实现高级穿梭框 Transfer 封装
javascript·vue.js·elementui
forwardMyLife3 小时前
element-plus的面包屑组件el-breadcrumb
javascript·vue.js·ecmascript
计算机学姐3 小时前
基于python+django+vue的影视推荐系统
开发语言·vue.js·后端·python·mysql·django·intellij-idea
luoluoal4 小时前
java项目之基于Spring Boot智能无人仓库管理源码（springboot+vue）
java·vue.js·spring boot
mez_Blog4 小时前
个人小结（2.0）
前端·javascript·vue.js·学习·typescript
深情废杨杨5 小时前
前端vue-插值表达式和v-html的区别
前端·javascript·vue.js
热门推荐
01RAG 实践- Ollama+RagFlow 部署本地知识库02组基轨迹建模 GBTM的介绍与实现（Stata 或 R）032024年高教社杯数学建模国赛C题超详细解题思路分析04苍穹外卖面试总结05yolov8实战第五天——yolov8+ffmpg实时视频流检测并进行实时推流——（推流，保姆教学）06【2024数模国赛赛题思路公开】国赛B题思路丨附可运行代码丨无偿自提07软件工程从理论到实践客观题汇总(头歌第一章至第八章)08Coze扣子平台完整体验和实践（附国内和国际版对比）09【2024高教社杯全国大学生数学建模竞赛】B题 生产过程中的决策问题——解题思路 代码 论文1051-2 万字长文，深度解读端到端自动驾驶的挑战和前沿