如何用Golang來手擼一個Blog - Milu.blog 開發總結

語言: CN / TW / HK

前段時間上線了一個小部落格,今天有點空總結一下 http://www.milu.blog ,走過路過的小夥伴不要錯過。 Golang 邊學邊擼,這個看起來不復雜的小東西前後搞了2個多月的時間。在前期技術選型時,做為一個略懂前端的菜鳥,在前端方面做了大部分捨棄,沒有選擇時下流行的技術棧反而選擇最原始的技術棧。這樣做的目的一方面希望自己能夠將主要的精力聚焦在 Golang 開發上,能夠在完成階段小目標的同時儘量不要沉迷於前臺頁面細節中,另外一方面還是希望能夠在初期問題比較多的時候能夠快速修復快速更新,給使用者和反饋問題的小夥伴能夠及時響應。就算這樣的目標,最終還是在前臺嘗試了三套不同的風格模板來展示,也花費了不少時間,有興趣的小夥伴可以試試。當然這些都是在 Pongo2 模板引擎的配合下完美實現,直接更新單個頁面不用重啟後臺服務,如果切換模板需要重啟服務。

這個專案的初衷就是通過一個基礎程式碼的練習來鞏固一下對 Golang 基礎知識的掌握,同時也能夠串聯起所學的其它知識,並且以最簡單的開發方式能夠快速開發完成並能釋出上線。由於側重的是 Golang ,前臺頁面用簡單的服務端方式渲染,沒有npm,webpack,沒有安裝依賴、壓縮,粗暴而簡單。後臺管理頁面在 Layuimini 的基礎上採用 iframe+vue 混合開發方式,原來通過 iframe 實現多標籤的功能及基礎佈局框架沒有變更,在業務頁面直接引入 vueelement 。優點是省去了安裝依賴包、上線前打包的步驟,缺點是支撐不了複雜的業務。可選的技術棧有:

  1. 前臺頁面可以用 Nuxt3 + ElementPlusNextjs + Antd 等方式。
  2. 後臺管理可以用 Vue3 + Arco , React + Antd 等等的方式。

倉庫地址:

1. 相關介紹

1.1 基本介紹

  • 麋鹿部落格 名字是為便於搜尋引擎和Github搜尋直達,同時組成整個動物系列開源專案。

1.2 技術棧

1.2.1 後臺

技術 | 說明 | 官網 ----|----|---- Golang - 1.18 | 開發語言 | https://go.dev/ Gin - 1.8.1 | Gin Web Framework | https://gin-gonic.com/zh-cn/docs/ Mysql - 5.7 | 資料庫 | https://www.mysql.com/cn/ Gorm - 1.9.16 | Golang ORM | https://gorm.io/zh_CN/docs/index.html Jwt | Golang jwt | https://github.com/golang-jwt/jwt Pongo2 - 5 | 模板引擎 | https://github.com/flosch/pongo2 Logrus | 日誌 | https://github.com/sirupsen/logrus Base64Captcha | 驗證碼 | https://github.com/mojocn/base64Captcha Crypto | 密碼庫 | https://golang.org/x/crypto Ini | ini檔案庫 | https://github.com/go-ini/ini Goment | 時間處理工具 | https://github.com/nleeper/goment Air | 熱更新工具 | https://github.com/cosmtrek/air

1.2.1 前臺

技術 | 說明 | 官網 ----|----|---- Vue - 2.x | 漸進式JavaScript 框架 | https://cn.vuejs.org/v2/guide/ Axios | 基於promise 的HTTP 庫 | https://github.com/axios/axios Element-UI | 前端UI元件庫 | https://element.eleme.io/ Tinymce | 視覺化HTML編輯器 | https://www.tiny.cloud/ Fontawesome | 圖示字型庫 | http://www.fontawesome.com.cn/

1.3 開發工具

系統 | 工具 | 官網 ----|----|---- Goland | 開發工具 | https://www.jetbrains.com/zh-cn/go/ Navicat | 資料庫管理工具 | https://www.navicat.com.cn/ Atom | 原始碼閱讀工具 | https://atom.io/ Cmder | Cmd替代工具[windows] | https://cmder.net/ Notepad2 | 臨時單檔案編輯[windows] | http://www.flos-freeware.ch/notepad2.html Chrome | 除錯工具 | https://www.google.com/intl/zh-CN/chrome/

1.4 檔案結構

整體的結構參考世上最優美的框架 Laravel

├─app                 // 核心程式碼
│  ├─controller       // 控制層
│  │  ├─admin
│  │  └─home
│  ├─database        // 資料庫連結
│  ├─model           // 模型層
│  └─service         // 操作資料層
├─config             // 配置檔案
├─pkg                // 所有工具檔案
│  ├─e               // 報錯
│  ├─hash            // 驗證碼
│  ├─response        // 返回封裝
│  └─utils           // 工具庫
├─public             // 所有靜態資源
│  ├─admin
│  ├─common
│  ├─data
│  ├─green
│  ├─home
│  └─uploads
├─routers             // 路由檔案
└─views               // 所有靜態資源
    ├─admin
    ├─green           // 綠色主題模板
    ├─default         // 預設模板
    └─home            // 普通模板

Tips:

  • Air 由於go本身沒有熱載入技術,所以還需要一個熱載入工具的支援。可選的也不多,

1. Fresh

Fresh滿足基礎的應用,每次儲存檔案都會生成或重新啟動Web應用程式,只是這工具多年未更新所以棄用。

2. Air

Air的優點也比較突出:彩色日誌輸出,自定義構建或二進位制命令,支援忽略子目錄,啟動後支援監聽新目錄等等的。

2.1 Air 存在問題

Air存在快取問題,雖然在cmd裡邊結束Air,但重新整理瀏覽器程式依然在執行,這時就需要手工結束程序然後重啟。

// 查詢 PID,9888為埠號
netstat -ano | findstr 9888
// 殺死程序,14172 查到的pid
taskkill /pid 14172 /f

2.2 Command not found 報錯

如果輸入 air 報這個錯,那需要在系統的path裡邊配置專案路徑,比如專案在 D:\go-project ,那麼在path裡邊就應該有一條:

D:\go-project\bin
  • Pongo2 由於是前後端未分離的開發方式,所以模板引擎扮演著重要的角色,起初的選型也看了不少。比如 goview ,仿ejs的 quicktemplate ,還有類ejs的 hero 等等的。最後選定Pongo2的理由是功能強大,上手容易,能夠容易實現分模板繼承不同模板的需求。他大體的思路和語法是仿Jinja2和Django模板的或基本一樣的。有諸如Extends、Macro、Block、Include等強大功能,如果有類 Django , Nunjucks 模板語法上手基本沒有難度,Pongo2文件寫的不是那麼詳細,有進一步瞭解還需要看倉庫原始碼 Template_tests 。 問題,與Vue的取值邊界符號有衝突。

兩種解決辦法:

  1. Vue的標籤用v-html來代替,比如: <div v-html="user.nickname"></div>
  2. 修改Vue的邊界修飾符 delimiters配置方式 。 Goland對Pongo2並沒有提供專門的語法高亮支援,這其中推薦另外一個外掛, Twig ,需要2步
  3. 安裝外掛 File -> Settings -> Plugins -> Twig
  4. 重啟開發工具

2. 如何在本地執行

以下以 windows 系統舉例 先從 官網 下載安裝最新版 Go 開發包 1.18.3 ,然後進行相關的配置。

2.1 環境變數的配置

在系統變數中新增 Go 開發相關的變數,需新增以下變數 變數名 | 值 | 說明 ----|----|---- GOPATH | d:\go-project | Go 語言的開發目錄 GOROOT | c:\Go | 安裝 Go 安裝目錄 PATH | c:\Go\bin;d:\go-project\bin | 終端可以直接執行 Go 命令; 執行自己編譯的 Go 程式和 Air GO111MODULE | on | 開啟 Go.mod 功能,統一用 go.mod 管理開發依賴包,此功能在 Go1.11 版本中新增 GOPROXY | https://goproxy.cn | Go 包下載代理地址

2.2 資料庫

2.2.1 Mysql 的安裝

Mysql 是我以前玩 PHP 的套件 Phpstudy ,有安裝方便、啟動便捷、管理省心等特點,當然也可以選擇單獨的 Mysql 來安裝。由於最終釋出的 寶塔 控制面板目前預設版本是 5.7 ,為了避免不必要的麻煩,我目前安裝這是這一版本。

2.2.2 資料匯入

然後匯入 elk-blg/public/data/elk-blog.sql 檔案。 預設管理入口:

http://localhost:4000/admin/login

初始使用者名稱: admin ,密碼: admin

2.2.3 執行

Cmd 中cd到當前目錄,然後直接輸入命令 air 後啟動專案。

$ cd D:\go-project\src\elk-blog
$ air

2.3 Goland 的配置

2.3.1 File -> Settings -> Go 下配置

變數名 | 值 | 說明 ----|----|---- GOPATH | d:\go-project | Go 語言的開發目錄 GOROOT | C:\Go | 會預設選擇系統安裝最高版本 GOPATH-Global GOPATH | d:\go-project | 全域性設定 Go Modules | GOPROXY=https://goproxy.cn,direct | 先從配置地址下載,若失敗,轉從原始地址下載 功能,統一用 go.mod 管理開發依賴包,此功能在 Go1.11 版本中新增 GOPROXY | https://goproxy.cn | Go 包下載代理地址

2.3.2 Settings -> Project Structure

排除 Exclued .idea, bin, pkg 等目錄,不進行索引,有效節省記憶體資源。

2.3.3 Settings -> Appearance

使用 One Dark 主題

2.4 Air 的配置

3. 如何上線釋出

由於本人特別菜,對經典的 linuxdocker 一直沒怎麼學會,所以這次選擇的是 寶塔 控制面板來輔助部署,以下的經驗也是基於寶塔來介紹。

3.1 安裝GO

寶塔Linux面板-安裝golang環境

  • 基本的步驟就是先從go官網下載 tar 包,然後上傳到伺服器指定目錄上 /usr/local ,這樣做的目的是,能夠快速完成節省時間。
  • 然後解壓新增環境變數 tar -xzvf go1.18.2.linux-amd64.tar.gz ,這裡邊需要說明的是寶塔的終端不能修改配置檔案,即沒有退出儲存的模式,需要ssh和直接在文字編輯模式修改。 我新增的環境變數:
export GOROOT=/usr/local/go # 設定為go安裝的路徑
export GOPATH=/www/wwwroot/GO #專案路徑
export PATH=$PATH:$GOROOT/bin:$GOPATH/bin
  • 寶塔終端輸入 go version ,顯示: go version go1.18.2 linux/amd64 即確認為安裝成功

3.2 新建網站

其實就是新建nginx配置檔案,比如新建網站 milu.blog ,然後在nginx中配置go服務埠入口。假如go的埠為 4000 ,則增加如下配置:

server{
  location / {
    proxy_pass  http://127.0.0.1:4000;
  }
}

3.3 準備打包go

go的打包命令只打包 *.go 結尾的檔案,換句話說非 *.go 的檔案需要自己手動上傳。如果經歷過 npm run build 洗禮的人,那go的這個build至少到現在沒有遇到大的問題,或許我程式碼寫的少的原因。

set CGO_ENABLED=0
set GOARCH=amd64
set GOOS=linux
go build main.go

3.4 上傳檔案

上傳的目錄為在環境變數裡邊定義的專案路徑,比如milu專案的目錄就是

/www/wwwroot/GO/milu

其它的專案就是

/www/wwwroot/GO/other

為了防止其它配置檔案尋找不到,那所有相關的檔案都在這個目錄中。那最後釋出完的 /www/wwwroot/GO/milu 下的檔案組織為:

├─config  // 配置檔案
├─public  // 靜態資源
├─views   // 模板檔案
├─main    // 打完包二進位制檔案

也就是說前面那麼多檔案,如果部署這些檔案就夠了。

3.5 上傳 SQL 檔案

這塊唯一說的是寶塔只支援 Mysql5.7 版本,暫不支援 Mysql8.0 ,手工安裝估計也可以,偷懶也沒折騰。為防止版本不相容,在本地開發時 Mysql 就為 5.7 。然後本地 Navicat 匯出結構和資料,在寶塔的 Phpmyadmin 裡邊匯入。

3.6 命令列終端除錯

在寶塔終端中cd到專案目錄 /www/wwwroot/GO/milu ,然後直接 ./main ,這樣方便的檢視日誌,能夠看到一些詳情的報錯資訊。執行 ./main 之後,就可以重新整理域名,如果各步正常頁面就能顯示出來。

3.7 PM2繫結程序

我也只是試試的心態用pm2來執行一下go,沒想到還真執行起來了。這樣暫時不安裝其它的服務,和Node服務一塊執行起來。

4. 感謝的人

此專案感謝以下各界人士的支援和幫助