如何在Gin框架模板中加载并渲染HTML代码？

问题原因 #

Gin默认会自动转义模板中的HTML特殊字符（如<、>），直接传递HTML字符串到模板时，会被当成纯文本显示，无法渲染成正常的HTML元素。

解决方案 #

1. 修改模板，关闭HTML内容转义 #

在你的index.tmpl模板中，使用safeHTML过滤器标记内容为安全HTML，告诉Gin无需转义：

<!-- index.tmpl -->
<!DOCTYPE html>
<html>
<head>
    <title>主页面</title>
</head>
<body>
    <div class="content">
        {{.Content | safeHTML}}
    </div>
</body>
</html>

2. 读取本地HTML文件并传递给模板 #

示例main.go代码，读取example.html内容后传入模板：

package main

import (
	"io/ioutil"
	"net/http"

	"github.com/gin-gonic/gin"
)

func main() {
	r := gin.Default()
	// 加载模板文件（假设index.tmpl在templates目录下）
	r.LoadHTMLGlob("templates/*")

	r.GET("/", func(c *gin.Context) {
		// 读取example.html文件内容
		htmlContent, err := ioutil.ReadFile("example.html")
		if err != nil {
			c.String(http.StatusInternalServerError, "读取HTML文件失败")
			return
		}
		// 将HTML内容传递给模板
		c.HTML(http.StatusOK, "index.tmpl", gin.H{
			"Content": string(htmlContent),
		})
	})

	r.Run(":8080")
}

3. 适配数据库读取HTML内容的场景 #

如果后续从数据库读取HTML内容，逻辑和读取本地文件一致，只需将查询到的HTML字符串传入模板即可：

// 示例：假设已从数据库获取到HTML内容
dbHTMLContent := "<p>数据库读取的HTML内容</p><img src='static/test.jpg'>"
c.HTML(http.StatusOK, "index.tmpl", gin.H{
	"Content": dbHTMLContent,
})

注意事项 #

• XSS风险：使用safeHTML意味着你完全信任传递的HTML内容。若内容来自用户输入或不可信来源，必须先做XSS过滤，防止恶意代码注入。
• 确保模板文件路径正确，Gin的LoadHTMLGlob/LoadHTMLFiles需能定位到模板文件。
• 若HTML内容包含静态资源（如图片、CSS），需配置Gin静态文件服务，比如：r.Static("/static", "./static")，确保资源能正常加载。

内容的提问来源于stack exchange，提问作者JACK