一、配置直接加载静态目录
-
1、项目中创建一个文件夹为
assets来存放静态目录(图片、css、js) -
2、在
main.go文件中添加以下代码package main import "net/http" func main() { http.Handle("/assets/", http.FileServer(http.Dir("."))) http.ListenAndServe(":8080", nil) } -
3、直接在浏览器上输入
http://localhost:8080/assets/1122.jpg就可以访问静态目录的文件 -
4、如果在
gin中使用呢package main import ( "github.com/gin-gonic/gin" "net/http" ) func main() { router := gin.Default() router.StaticFS("/assets/", http.Dir("./assets")) router.Run(":8080") }
二、模板渲染
-
1、在项目中创建一个
views的文件，并且里面存放html模板 -
2、创建一个通用的模板渲染方法
func RegisterView() { // 一次性解析出全部的模板 tpl, err := template.ParseGlob("views/**/*") if err != nil { log.Fatal("解析模板出错" + err.Error()) } for _, item := range tpl.Templates() { templateName := item.Name() fmt.Println("当前模板名称:" + templateName) http.HandleFunc(templateName, func(writer http.ResponseWriter, request *http.Request) { err := tpl.ExecuteTemplate(writer, templateName, nil) if err != nil { log.Fatal("渲染模板失败:" + err.Error()) } }) } } -
3、直接使用
func main() { http.Handle("/assets/", http.FileServer(http.Dir("."))) // 全局注册模板渲染器 RegisterView() http.ListenAndServe(":8080", nil) } -
4、在
view/user/login.html文件中添加前端代码{ { define "/user/login.html"}} <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>登录</h1> </body> </html> { { end}} -
5、浏览器上输入地址
http://localhost:8080/user/login.html -
6、在
gin中渲染模板package main import ( "github.com/gin-gonic/gin" "net/http" ) func main() { router := gin.Default() router.StaticFS("/assets/", http.Dir("./assets")) router.LoadHTMLGlob("views/**/*") router.GET("/user/register", func(ctx *gin.Context) { ctx.HTML(http.StatusOK, "register.html", nil) }) router.Run(":8080") }<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>注册页面</h1> <img src="/assets/1122.jpg" /> </body> </html> -
7、页面访问
http://localhost:8080/user/register
三、公共模板的嵌套
-
1、原生中使用
{ {define "/user/login.html"}} <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>登录</h1> { {template "/user/test1.html"}} </body> </html> { {end}} -
2、在
gin中<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>注册页面</h1> <img src="/assets/1122.jpg" /> { {template "/user/test2.html"}} </body> </html>{ { define "/user/test2.html" }} <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>测试</h1> </body> </html> { {end}}