Gin - HTML 模板渲染

1. 简单应用

• Gin 支持 HTML 模板，然后将参数渲染到模板页面并返回，本质上是对页面内容进行字符串替换

• 可以使用 LoadHTMLGlob(pattern string) 方法加载模板文件

  g := gin.Default()
  g.LoadHTMLGlob("template/**/*")
  

1.1 单目录结构

• 目录结构如下

|- template
   |- index.html
|- main.go

• main.go 代码：

func main() {
    g := gin.Default()
    // 加载 template 目录下的模板文件
    g.LoadHTMLGlob("template/*")
    g.GET("/index", func(ctx *gin.Context) {
        ctx.HTML(http.StatusOK, "index.html", gin.H{
            "title": "HTML 模板渲染样例",
            "body": "这里是内容",
        })
    })
    g.Run()
}

• template/index.html 代码：

    
    
    
    
    
    

    
        {{ .body }}
    	
        
    

1.2 多级目录结构

• 目录结构如下

|- template
   |- user
      |- index.html
|- main.go

• main.go 代码：

func main() {
    g := gin.Default()
    // 加载 template 目录下的模板文件
    g.LoadHTMLGlob("template/**/*")
    g.GET("/index", func(ctx *gin.Context) {
        ctx.HTML(http.StatusOK, "user/index.html", gin.H{
            "title": "HTML 模板渲染样例",
            "body": "这里是内容",
        })
    })
    g.Run()
}

• template/user/index.html 代码：

{{ define "user/index.html" }}



    
    
    
    
    
    


	{{ .body }}
	
	


{{ end }}

2. 模板复用

• 目录结构如下：

|- static
|- template
   |- public
      |- footer.html
      |- header.html
   |- user
      |- index.html
|- main.go

• main.go 代码：

func main() {
    g := gin.Default()
    // 加载 template 目录下的模板文件
    g.LoadHTMLGlob("template/**/*")
    g.GET("/index", func(ctx *gin.Context) {
        ctx.HTML(http.StatusOK, "user/index.html", gin.H{
            "title": "HTML 模板渲染样例",
            "body": "这里是内容",
        })
    })
    g.Run()
}

• user/index.html 代码：

{{ define "user/index.html" }}


{{ template "public/header" . }}
{{ template "public/footer" . }}

{{ end }}

• public/header.html 代码：

{{ define "public/header" }}

    
    
    
    
    
    

{{ end }}

• public/footer.html 代码：

{{ define "public/footer" }}

	{{ .body }}
	
	

{{ end }}

3. 静态资源文件映射

• 可以使用 Static(uriPath, rootPath string) 方法配置静态资源文件目录

g.Static("/static", "./static")