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

---

 

1、運行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目錄下

---

 

 2、使用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）簡單看下接口運行的時間

 

---

 

3、運行vue-admin項目

（1）在/gin-vue/vue-admin目錄下運行：npm install

 

（2）運行：npm run dev

瀏覽器自動打開 http://localhost:9528/#/login?redirect=%2Fdashboard，而後就能夠像文章開頭的動圖同樣玩了

---

 

4、總結

初步體驗了gin框架，整體上仍是能夠的

 

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

喜歡的請star