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

目录

一、简介

二、模版库

三、菜鸟实战

1、新建文件

2、编译和运行

3、运行结果

3.1、运行后服务启动,控制台输出

3.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>  

2、编译和运行

# 1、生成模块依赖
go mod init g014
 
# 2、编译
go build g014.go 
 
# 3、编译后的目录结构

└── go-014
    ├── g014
    ├── g014.go
    └── go.mod
    └── index.html


# 4、运行
go run g014

3、运行结果

3.1、运行后服务启动,控制台输出

Hello 菜鸟实战

3.2、浏览器输入后结果 

  

 菜鸟实战,持续学习!

  • 16
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 8
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

菜鸟实战

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值