Go高级之利用Gin框架简单实现服务端渲染

发布于

前言

本文是探讨的是"Gin框架简单实现服务端渲染"

此文章是个人学习归纳的心得，未经允许，严禁转载，如有不对, 还望斧正, 感谢!

热身

你知道我们常说的网站秒开是用什么技术实现的吗？

服务端渲染

服务端渲染（Server-side rendering，SSR）是将网页的渲染过程从客户端移至服务器端进行的一种技术。与客户端渲染（Client-side rendering，CSR）相比，服务端渲染具有以下优势：

  • 1.更好的首次加载性能：服务端渲染可以在服务器端直接生成完整的HTML页面，并将其发送给浏览器，使得网站可以在用户首次访问时更快地渲染出来。这可以提高网站的加载速度和用户体验。
  • 2. 更好的SEO（搜索引擎优化）：由于搜索引擎爬虫通常只会抓取和渲染HTML内容，而不会执行JavaScript代码，因此服务端渲染可以确保搜索引擎能够正确地抓取和索引网页内容，提高网站在搜索结果中的排名。
  • 3. 更好的可访问性：服务端渲染可以确保网站在没有JavaScript支持或JavaScript执行失败的情况下仍然能够正常显示内容，提高了网站的可访问性。
  • 4. 更好的性能表现：服务端渲染可以减轻客户端设备的负担，因为服务器已经执行了部分渲染工作，客户端只需要处理少量的JavaScript代码，从而提高了网站的性能表现。

我们通过服务端渲染,可以最大限度的发挥好云服务器的作用,恰逢程序员1024节,腾讯云这边优惠力度很大,有需求的朋友可以搞台云服务器玩一下,尝试一下服务端渲染

go语言中用Gin快速实现服务端渲染

先实现一个简单的web服务器

先用Gin 实现一个简单Web服务器

代码语言：go
复制
package main

func main(){

router := gin.Default()


router.GET("/",func(c *gin.Context){

c.String(200,"您好")

})


router.Run(":9090")

}

完成上面的代码后，我们直接运行，可以看到下面的运行结果

监听的是9090端口，并且只有一条GET的路由

再进行服务端渲染

服务端渲染，其实就是先把html之类的先在服务端进行拼凑，然后直接返回给浏览器渲染，不需要浏览器重新进行代码的拼凑了。

所以我们先建一个index.html 文件，里面的内容随意，前端代码随便整点就行

然后就是重头戏了，服务端渲染，gin框架给我们封装好了两个函数LoadHTMLGlob和LoadHTMLFiles,这两个函数是用来读取前端代码的，然后存到实例中去

先将LoadHTMLFiles，这个函数的签名如下，用了... 也就是可变参数语法糖，可以读取任意数值的参数

代码语言：txt
复制
func (engine Engine) LoadHTMLFiles(files ...string)

所以我们很容易的就知道了，这个函数可以一次读取多个，如下

代码语言：txt
复制
router.LoadHTMLFiles("HTML/index.html","HTML/index2.html")

但是不推荐使用，因为另外一个函数LoadHTMLGlob可以爆杀它，用法如下

代码语言：txt
复制
// 可以用通配符来进行全部匹配

router.LoadHTMLGlob("02_HtmlRendering/HTML/") //选择HTML文件夹下面的所有文件

router.LoadHTMLGlob("02_HtmlRendering/HTML/Text/") //选择HTML文件夹下的Text文件夹里面的所有文件

router.LoadHTMLGlob("02_HtmlRendering/HTML/**/") //选择HTML文件夹下的所有文件夹内的所有文件

特别是router.LoadHTMLGlob("02_HtmlRendering/HTML/**/*")选择HTML文件夹下的所有文件夹内的所有文件,这个特别酷。

通过这两个函数，我们可以把前端代码和渲染引擎相关联，然后还要使用

代码语言：txt
复制
c.HTML(200, "index.html", nil)

来进行返回响应。

请看完整版的，先看目录结构

我们使用LoadHTMLGlob可以很方便读取，可以看下面的代码

代码语言：txt
复制
package main


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


func main() {

router := gin.Default()


router.LoadHTMLGlob("02_HtmlRendering/HTML/**/*") //选择HTML文件夹下面每个次文件夹内的所有文件，这玩意路径要对


//router.LoadHTMLFiles("HTML/index.html","HTML/index2.html")   不推荐用这个函数


router.GET("/", func(c *gin.Context) {


  // 渲染html要这么用，最后一个是可以将数据传到html里面的
  c.HTML(200, "index.html", nil)   // index.html是选择之前定位的路径下面的文件



})


router.Run(":9090")

}

第8行我们读取了html代码，然后第15行我们把这个代码响应了回去，我们可以在浏览器中进行访问localhost:9090/看到我们自己写的html里面的内容

到这里，一个简单的服务端渲染，就已经完成了。

那如果我们需要给两个路由都进行服务端渲染呢？ 也就是下图的结构

你知道该怎么渲染吗？

我将在下一期内容继续进行学习进度总结,欢迎订阅我的专栏

我正在参与2023腾讯技术创作特训营第二期有奖征文，瓜分万元奖池和键盘手表

#2023腾讯·技术创作特训营 第二期#go#服务端渲染#后端#学习笔记