一、模板引入
在進行Web開發中,你可能進行的項目是前后端不分離的情況,此時需要將html與后端放入一個工程中,gin框架支持這種做法,需要通過 LoadHTMLGlob() 或 LoadHTMLFiles()。
(一)LoadHTMLFiles
故名思義就是加載文件
1、main.go
package main import ( "github.com/gin-gonic/gin" "net/http" ) func main() { router := gin.Default() router.LoadHTMLFiles("templates/index.html") router.GET("/index", func(c *gin.Context) { c.HTML(http.StatusOK, "index.html", gin.H{ "title": "main site", }) }) router.Run(":8000") }
2、index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> {{ .title }} </body> </html>
3、目錄結構
│ main.go
│
└─templates
index.html
此時需要進入當前目錄,通過go run main.go運行,否則會出現找不到路徑的情況。
(二)LoadHTMLGlob
可以以指定的模式匹配文件:
func main() { router := gin.Default() router.LoadHTMLGlob("templates/*") //加載templates目錄下所有文件 router.GET("/index", func(c *gin.Context) { c.HTML(http.StatusOK, "index.html", gin.H{ "title": "main site", }) }) router.Run(":8000") }
另外就是可以解決不同目錄下同名文件問題。
1、main.go
package main import ( "github.com/gin-gonic/gin" "net/http" ) func main() { router := gin.Default() router.LoadHTMLGlob("templates/**/*") router.GET("/index", func(c *gin.Context) { c.HTML(http.StatusOK, "index.html", gin.H{ "title": "main site", }) }) router.GET("/users/index", func(c *gin.Context) { c.HTML(http.StatusOK, "index.html", gin.H{ "title": "users site", }) }) router.GET("/posts/index", func(c *gin.Context) { c.HTML(http.StatusOK, "index.html", gin.H{ "title": "posts site", }) }) router.Run(":8000") }
2、index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> {{ .title }} </body> </html>
3、目錄結構
│ main.go
│
└─templates
│ index.html
│
├─posts
│ index.html
│
└─users
index.html
二、靜態資源引入
在進行不分離的開發情況下,通過會有css、js、image等資源的引入。
1、main.go
package main import ( "github.com/gin-gonic/gin" "net/http" ) func main() { router := gin.Default() router.LoadHTMLFiles("templates/index.html") /* 表示只要靜態資源的路徑是以/static開頭的,就去項目根路徑的static目錄下尋找 在index.html文件中引入靜態資源剛好是以/static開頭的 */ router.Static("/static", "./static") //router.StaticFS("/static", http.Dir("./static")) router.GET("/index", func(c *gin.Context) { c.HTML(http.StatusOK, "index.html", gin.H{ "title": "main site", }) }) router.Run(":8000") }
2、index.html
<!DOCTYPE html> <html lang="en"> <link rel="stylesheet" href="/static/css/style.css"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>{{ .title }}</h1> </body> </html>
3、style.css
h1 { color: red; }
4、目錄結構
│ main.go
│
├─static
│ └─css
│ style.css
│
└─templates
index.html