Gin支持HTML渲染来完成对于传统MVC模式的支持。
以下是使用Gin框架渲染HTML模板的示例代码:
package main
import (
"net/http"
"github.com/gin-gonic/gin"
)
func main() {
// 创建一个默认的路由引擎
router := gin.Default()
// 设置HTML模板文件目录
router.LoadHTMLGlob("templates/*")
// 定义路由
router.GET("/", func(c *gin.Context) {
// 渲染HTML模板
c.HTML(http.StatusOK, "index.tmpl", gin.H{
"title": "Gin HTML模板示例",
})
})
// 启动HTTP服务
router.Run(":8080")
}
上述代码中,router.LoadHTMLGlob
方法指定了HTML模板文件所在的目录,该目录下所有以.tmpl
为扩展名的文件都会被加载。
在路由处理函数中,可以使用c.HTML
方法渲染HTML模板。该方法的第一个参数是HTTP状态码,第二个参数是模板文件的文件名,第三个参数是传递给模板的变量。在上述示例中,我们传递了一个变量title
,其值为Gin HTML模板示例
。
在模板文件中可以通过{{ . }}
语法来访问变量。例如,在上述示例中,可以使用{{ .title }}
来访问title
变量的值。
以下是一个简单的HTML模板示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>{{ .title }}</title>
</head>
<body>
<h1>{{ .title }}</h1>
</body>
</html>
上述模板文件中,{{ .title }}
语法会被渲染成变量title
的值。
模版有多种加载方式,还有通过LoadHTMLFiles
方法加载HTML模板文件。
func main() {
router := gin.Default()
// 或者加载多个HTML模板文件
router.LoadHTMLFiles("templates/index.tmpl", "templates/layout.tmpl")
router.Run(":8080")
}
自定义模版布局
模板布局是指在多个HTML模板文件中公共部分的抽象表示。可以使用define
和template
模板函数来定义和使用模板布局。
func main() {
router := gin.Default()
router.LoadHTMLGlob("templates/*")
router.GET("/", func(c *gin.Context) {
c.HTML(http.StatusOK, "index.tmpl", gin.H{
"title": "首页",
})
})
router.GET("/about", func(c *gin.Context) {
c.HTML(http.StatusOK, "about.tmpl", gin.H{
"title": "关于我们",
})
})
router.Run(":8080")
}
以下是index.tmpl
和about.tmpl
的示例:
<!-- index.tmpl -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>{{ .title }}</title>
</head>
<body>
{{ template "content" . }}
</body>
</html>
<!-- about.tmpl -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>{{ .title }}</title>
</head>
<body>
{{ template "content" . }}
</body>
</html>
<!-- content.tmpl -->
{{ define "content" }}
<h1>{{ .title }}</h1>
{{ end }}
自定义模版函数
模版函数主要用于在模版中使用的,用于辅助页面显示的函数,比如格式转换等,例子如下
import (
"fmt"
"html/template"
"net/http"
"time"
"github.com/gin-gonic/gin"
)
func formatAsDate(t time.Time) string {
year, month, day := t.Date()
return fmt.Sprintf("%d/%02d/%02d", year, month, day)
}
func main() {
router := gin.Default()
router.Delims("{[{", "}]}")
router.SetFuncMap(template.FuncMap{
"formatAsDate": formatAsDate,
})
router.LoadHTMLFiles("./testdata/template/raw.tmpl")
router.GET("/raw", func(c *gin.Context) {
c.HTML(http.StatusOK, "raw.tmpl", map[string]interface{}{
"now": time.Date(2017, 07, 01, 0, 0, 0, 0, time.UTC),
})
})
router.Run(":8080")
}
raw.tmpl
Date: {[{.now | formatAsDate}]}
结果:
Date: 2017/07/01
自定义模版渲染器
Gin框架可以使用模板引擎来渲染HTML模板。常用的模板引擎有HTML/template、Mustache、Handlebars,下面是使用自定义的 html 模板渲染的例子
import "html/template"
func main() {
router := gin.Default()
html := template.Must(template.ParseFiles("file1", "file2"))
router.SetHTMLTemplate(html)
router.Run(":8080")
}
更复杂的例子
看以下代码,它演示了使用Gin模板引擎渲染HTML模板,以及如何从模板获取表单数据:
package main
import (
"net/http"
"github.com/gin-gonic/gin"
)
func main() {
router := gin.Default()
// 首页路由
router.GET("/", func(c *gin.Context) {
c.HTML(http.StatusOK, "index.tmpl", gin.H{
"title": "Gin Example",
})
})
// 处理表单提交
router.POST("/submit", func(c *gin.Context) {
// 从POST表单获取数据
firstname := c.PostForm("firstname")
lastname := c.PostForm("lastname")
c.HTML(http.StatusOK, "submit.tmpl", gin.H{
"firstname": firstname,
"lastname": lastname,
})
})
router.Run(":8080")
}
其中,我们定义了两个路由:一个是处理首页请求,一个是处理表单提交请求。在首页路由中,我们使用Gin的HTML方法渲染了一个名为"index.tmpl"的HTML模板,同时传递了一个变量"title"给模板。在表单提交路由中,我们使用PostForm方法从POST表单中获取数据,然后再将数据传递给名为"submit.tmpl"的HTML模板。
下面是"index.tmpl"和"submit.tmpl"的内容:
<!-- index.tmpl -->
<!DOCTYPE html>
<html>
<head>
<title>{{ .title }}</title>
</head>
<body>
<h1>{{ .title }}</h1>
<form action="/submit" method="POST">
<label for="firstname">First Name:</label>
<input type="text" name="firstname" id="firstname"><br><br>
<label for="lastname">Last Name:</label>
<input type="text" name="lastname" id="lastname"><br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
<!-- submit.tmpl -->
<!DOCTYPE html>
<html>
<head>
<title>Form Submitted</title>
</head>
<body>
<h1>Form Submitted</h1>
<p>First Name: {{ .firstname }}</p>
<p>Last Name: {{ .lastname }}</p>
</body>
</html>
以上示例代码和HTML模板都可以用于参考和学习。当然,在实际开发中,需要根据具体的业务需求和情况进行相应的调整和改进。