Golang+Vue輕松構建Web應用的方法步驟

更新時間：2022年05月06日 08:33:53 作者：qingwave

本文主要介紹了Golang+Vue輕松構建Web應用，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧

介紹

Weave是一個基于Go+Vue實現(xiàn)的Web應用模板，支持前后端，擁有完整的認證、存儲、Restful API等功能。

后端基于Golang開發(fā)，主要特性如下：

Restful API，通過gin實現(xiàn)，支持swagger
MVC架構
支持Postgres存儲，可以輕松替換為MySQL，使用gorm接入
Redis緩存
基于JWT認證
服務優(yōu)雅終止
請求限速
Docker容器管理，Websocket支持
其他支持Prometheus監(jiān)控、格式化日志、PProf等

前端基于Vue開發(fā)，使用ElementPlus組件庫

Vue3開發(fā)，使用組合式API
使用vite快速編譯
支持WebShell，基于xtermjs
圖表功能，基于echarts
支持WindiCSS，減少CSS編寫

主要界面如下：

登錄界面

Dashboard界面

應用界面

WebShell界面

項目結構

項目組織如下：

├── Dockerfile
├── Makefile
├── README.md
├── bin
├── config # server配置
├── docs # swagger 生成文件
├── document # 文檔
├── go.mod
├── go.sum
├── main.go # server入口
├── pkg # server業(yè)務代碼
├── scripts # 腳本
├── static # 靜態(tài)文件
└── web # 前端目錄

后端結構

后端按照MVC架構實現(xiàn)，參考了社區(qū)一些最佳實踐，具體如下：

├── pkg
│   ├── common # 通用包
│   ├── config # 配置相關
│   ├── container # 容器庫
│   ├── controller # 控制器層，處理HTTP請求
│   ├── database # 數(shù)據(jù)庫初始化，封裝
│   ├── metrics # 監(jiān)控相關
│   ├── middleware # http中間件
│   ├── model # 模型層
│   ├── repository # 存儲層，數(shù)據(jù)持久化
│   ├── server # server入口，創(chuàng)建router
│   └── service # 邏輯層，處理業(yè)務

前端結構

前端實現(xiàn)Vue3實現(xiàn)，與一般Vue項目類似

web
├── README.md
├── index.html
├── node_modules
├── package-lock.json
├── package.json
├── public
│   └── favicon.ico
├── src # 所有代碼位于src
│   ├── App.vue # Vue項目入口
│   ├── assets # 靜態(tài)文件
│   ├── axios # http請求封裝
│   ├── components # Vue組件
│   ├── main.js
│   ├── router # 路由
│   ├── utils # 工具包
│   └── views # 所有頁面
└── vite.config.js # vite配置

一些細節(jié)

為什么使用JWT

主要是為了方便服務橫向擴展，如果基于Cookie+Session，Session只能保存在服務端，無法進行負載均衡。另外通過api訪問，jwt可以放在HTTP Header的Bearer Token中。

當使用Websocket時，不支持HTTP Header，由于認證統(tǒng)一在中間件中進行，可以通過簡單通過cookie存儲，也可以單獨為Websocket配置認證。

JWT不支持取消，可以通過在redis存入黑名單實現(xiàn)。

緩存實現(xiàn)

加入了緩存便引入了數(shù)據(jù)一致性問題，經(jīng)典的解決辦法是先寫數(shù)據(jù)庫再寫緩存（Cache-Aside模式），實現(xiàn)最終一致性，業(yè)務簡單的項目可以使用這種方法。

那先寫緩存行不行？如果同時有一個寫請求一讀請求，寫請求會先刪除緩存，讀請求緩慢未命中會將DB中的舊數(shù)據(jù)載入，可能會造成數(shù)據(jù)不一致。先寫數(shù)據(jù)庫則不會有這樣的問題，如果要實現(xiàn)先寫緩存，可以使用雙刪的辦法，即寫前后分別操作一次緩存，這樣處理邏輯會更復雜。如果不想侵入業(yè)務代碼，可以通過監(jiān)聽Binlog來異步更新緩存。