gin+vue的前后端分离开源项目

该项目是gin+vue的前后端分离项目,使用gorm访问MySQL,其中vue前端是使用vue-element-admin框架简单实现的;

go后台使用jwt,对API接口进行权限控制。此外,Web页面在token过期后的半个小时内,用户再次操作会自动刷新token;

项目很小,适合gin新手学习!(后续有时间会补上相关教程)

GitHub地址:https://github.com/Bingjian-Zhu/gin-vue


一、运行go后台项目

(1)把项目clone到GOPATH/src目录下

(2)在MySQL中新建blog数据库,运行文件夹/docs/sql中的mysql.sql脚本

(3)在文件夹/conf中修改配置文件api.ini中的数据库连接配置

(4)在gin-vue目录下运行:go run main.go

目前为止,gin后台项目成功跑起来了

(5)可能遇到的问题

  • 如果在GitHub是用下载压缩包的形式,解压后请把文件夹gin-vue-master重名为gin-vue,然后再复制到/GOPATH/src目录下

二、使用Postman测试API接口

(1)登录,token过期时间设为5分钟

(2)使用token调用API接口

(3)API权限验证

当使用admin登录获取的token调用/api/v1/table/list接口时,能获取到数据

改用test用户登录获取的token调用/api/v1/table/list接口时,返回403,没有权限

(4)刷新token

当token过期后,可以调用/auth/refresh_token接口重新获取token,再用获取到的token去调用接口

当然刷新token也是有有限期的,这里设置了1个小时

(5)简单看下接口运行的时间


三、运行vue-admin项目

(1)在/gin-vue/vue-admin目录下运行:npm install

(2)运行:npm run dev

浏览器自动打开 http://localhost:9528/#/login?redirect=%2Fdashboard,然后就可以像文章开头的动图一样玩了


四、总结

初步体验了gin框架,总体上还是可以的

再次附上源码地址:https://github.com/Bingjian-Zhu/gin-vue

喜欢的请star

原文地址:https://www.cnblogs.com/FireworksEasyCool/p/11385271.html

时间: 2024-08-01 14:33:42

gin+vue的前后端分离开源项目的相关文章

关于使用vue搭建前后端分离的项目,部署过程遇到的问题

1.首先应该有三个端口号:app前端.网页前端.后台接口  后台接口有很多,但是会映射到zuul上,保证他的端口号是对外开放的,其他不被占用就行 2.pc前端访问后台路径 他的baseUrl是每一次请求的基础路径,需要写服务器后台对外开放的ip和端口号,tomcat部署前端服务也得需要另一个端口号 3.然后发现他的静态资源都访问不到,可以看我的另一篇博客  https://www.cnblogs.com/vv-lilu/p/11106894.html 4.使用vue-lic3搭建的手机端框架,静

基于Vue的前后端分离项目实践

一.为什么需要前后端分离 1.1什么是前后端分离  前后端分离这个词刚在毕业(15年)那会就听说过,但是直到17年前都没有接触过前后端分离的项目.怎么理解前后端分离?直观的感觉就是前后端分开去做,即功能和职责上的一种划分,前端负责页面的渲染,部分页面交互的逻辑,然后通过网络请求与后端进行数据的交互:后端则着重关注业务逻辑的处理,直接操控数据库. 1.2前后端未分离前(1)jsp + servlet 开发模式: JSP页面:负责视图层的渲染及交互,内部可以嵌入java 代码,在某些场景下开发起来比

docker-compose 部署 Vue+SpringBoot 前后端分离项目

一.前言 本文将通过docker-compose来部署前端Vue项目到Nginx中,和运行后端SpringBoot项目 服务器基本环境: CentOS7.3 Dokcer MySQL 二.docker-compose 部署Vue+SpringBoot 前后端分离项目 整体项目配置结构,这里在不影响原来项目的结构,因此将所有配置文件都提出来存放到docker文件夹内了,但注意docker-compose文件须放到项目总的根目录下哦! 1.新增后端所需配置文件api-Dockerfile # 指定基

一套基于SpringBoot+Vue+Shiro 前后端分离 开发的代码生成器

一.前言 最近花了一个月时间完成了一套基于Spring Boot+Vue+Shiro前后端分离的代码生成器,目前项目代码已基本完成 止步传统CRUD,进阶代码优化: 该项目可根据数据库字段动态生成 controller.mapper.service.html.jsp.vue.php..py ... 等各种类型代码,采用 velocity 模板引擎在页面动态配置生成代码,前后端动态权限配置,前端权限精确到 按钮 级别,后端权限精确到 uri 上,QQ授权第三方单用户登录...等 基本环境: JDK

vue+springboot前后端分离工程中跨域问题的解决

vue+springboot前后端分离工程中跨域问题的解决 假如是在同一台机器上开发,前后端分离的工程中出现跨域问题的原因是,前端工程和后端工程运行在不同的端口上.只要协议.域名.端口有一个不同就会产生跨域问题,所以在前端工程中请求后端的接口时就会因为端口不同而产生跨域问题. 一.解决跨域的原理 假设前端A要去访问服务器C,可以在A和C之间之间设置一个代理B,A访问C时先访问B,再由B代为请求C并把请求结果返回给A,这样就可以解决跨域问题.其中需要保证的是A访问B和B访问C都不能存在跨域. 二.

java结合node.js非对称加密,实现密文登录传参——让前后端分离的项目更安全

前言   在参考互联网大厂的登录.订单.提现这类对安全性操作要求较高的场景操作时发现,传输的都是密文.而为了目前项目安全,我自己负责的项目也需要这方面的技术.由于,我当前的项目是使用了前后端分离技术,即node.js做前端,spring boot做后端.于是,我开始搜索有关node.js与java实现非对称加密的资料,然而,我却没有得到一个满意的答案.因此,我有了写本篇博客的想法,并希望给用到这类技术的朋友提供帮助. 一.明文密码传输对比 首先. 构建spring boot 2.0项目 引入we

前后端分离分布式项目开发(二)-Dubbox框架

==========================================精品教程推送:PL14352018年最新JavaEE(Java1.8)SSMWeb项目实战学习要趁早,点滴记录,学习就是进步! 不要到处找了,抓紧提升自己!版权保护,加Q:1225462853 Q群:702101215或关注公众号:菜鸟奋斗 ========================================== 3.Dubbox框架 3.1 Dubbox简介 Dubbox 是一个分布式服务框架,其前

python框架django中结合vue进行前后端分离

一.创建django项目 1.django-admin startproject mysite # 创建mysite项目 2.django-admin startapp app01# 创建app01应用  二.安装vue 安装vue-cli:npm install -g vue-cli (Vue-cli是Vue的脚手架工具,-g表示在全局下安装vue-cli) 安装webpack: npm install webpack -g  (包管理工具,主要是打包和解包用的) 创建项目:vue init

解决vue+springboot前后端分离项目,前端跨域访问sessionID不一致导致的session为null问题

问题: 前端跨域访问后端接口, 在浏览器的安全策略下默认是不携带cookie的, 所以每次请求都开启了一次新的会话. 在后台打印sessionID我们会发现, 每次请求的sessionID都是不同的, 既然每次请求都是一个新的会话, 那我们去获取session的时候自然就是null了. 解决办法如下: 环境: vue 2.0 springboot 2.1.6 一.前端部分 1.  在vue引入axios的位置添加以下代码 import axios from 'axios' axios.defau