【Go实战基础】程序里面数据是如何显示到浏览器当中的

最新推荐文章于 2024-01-26 14:27:33 发布

菜鸟实战

最新推荐文章于 2024-01-26 14:27:33 发布

阅读量837

点赞数 16

分类专栏： GO 实战基础文章标签： golang 开发语言 html5 后端模板方法模式

本文链接：https://blog.csdn.net/qq_39816613/article/details/125008045

版权

GO 实战基础专栏收录该内容

23 篇文章 2 订阅

订阅专栏

一、简介

在 Web 中, 我们通常需要在后端将一些数据渲染到 HTML 文档中, HTML 就可以在浏览器中显示，从而实现动态的网页效果。

模板可以被理解为事先定义好的 HTML 文档。模板渲染可以被简单理解为文本替换操作: 是后端用相应的数据去替换 HTML 文档中实现准备好的标记。模板技术多种多样，但本质是将模板文件和数据通过模板引擎生成最终的HTML文档。

二、模版库

Go 提供了两个基础模板库 :

text/template
html/template

html/template 在渲染页面模板时会在后台进行一些编码，以帮助防止造成代码注入（XSS 攻击），用的比较多，所以我们主要使用这个模版库来做实战。

三、菜鸟实战

实战场景：使用 html/template 模版渲染数据到浏览器中

马上安排！

1、新建文件

/*
 * @Author: 菜鸟实战
 * @FilePath: /go110/go-014/g014.go
 * @Description: html/template 模版渲染数据到浏览器
 */

package main

import (
	"fmt"
	"html/template"
	"log"
	"net/http"
	"runtime"
)

// 用户信息
type User struct {
	Name   string
	Gender string
	Age    int
}

// 显示数据
func render(w http.ResponseWriter, r *http.Request) {
	//加载模板 解析模板， 此处输入文件绝对路径
	t, err := template.ParseFiles("yourpath/index.html")
	if err != nil {
		log.Println("模版解析错误, err %v ", err)
		return
	}

	// 渲染字符串
	name := "user1"
	//err = t.Execute(w, name)

	// 渲染结构体
	user := User{
		Name:   name,
		Gender: "女",
		Age:    23,
	}

	// 渲染 map
	m := map[string]interface{}{
		"name":   name,
		"gender": "男",
		"age":    25,
	}
	//err = t.Execute(w, m)

	// 渲染数组
	carList := []string{
		"汽车",
		"火车",
		"货车",
	}

	// 把对象传输到模板展示
	err = t.Execute(w, map[string]interface{}{
		"name":    name,
		"m":       m,
		"user":    user,
		"carList": carList,
	})
	if err != nil {
		log.Println("渲染模版失败, err %v", err)
		return
	}
}

func main() {
	// 使用内置函数打印
	println("Hello", "菜鸟实战")

	http.HandleFunc("/", render)

	err := http.ListenAndServe(":8009", nil)

	if err != nil {
		log.Println("http服务启动异常, err: %v", err)
	}

	// 当前版本
	fmt.Printf("版本: %s \n", runtime.Version())
	fmt.Printf("菜鸟实战，持续学习! \n")
}

对应的模版文件 index.html 为

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Hello</title>
</head>
<body>
<p>名称 {{ .user.Name }}</p>
<p>年龄 {{ .user.Age }}</p>
<p>性别 {{ .user.Gender }}</p>

<p>名称 {{ .m.name }}</p>
<p>年龄 {{ .m.age }}</p>
<p>性别 {{ .m.gender }}</p>

<hr>
       {{if .carList}}
       {{range .carList}}
         <div>{{ . }}</div>
         {{else}}<div>
            <strong>no rows</strong></div>{{end}}
        {{else}}
            <p>carList为空</p>
        {{end}}
</body>
</html>