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目錄下: git clone https://github.com/Bingjian-Zhu/gin-vue.git

 

 

(2)在MySQL中運行文件夾/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

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM