Go 语言 Gin 框架 Web开发 HTML 加载静态资源

开发目的:Gin 框架 加载HTML 静态资源

最近在使用Go 语言进行Web 端开发。看来看去,就使用了Gin框架。开发过程中遇到了不少的问题,希望将问题和解决方式分享给大家。可以让Go语言开发的社区更加活跃。

问题复现:HTML 路径指定错误,导致前端无法加载图片

1.使用Bootstrap 官网推荐的在线 网络框架搭建网站 Layoutit.com。经编辑过后获得 html / css / javascript 等文件。 其中,加载图片,加载css文件等的路径自动生成为

../css/bootstrap.min.css
../img/xxx.jpg
../js/scripts.js

 2. 此处  “../css/",开头的两个点就是让我页面加载不出来的原因。在这里,我们需要自己进行修改,一般是可以把 .. 替换为/static 。只要在html 页面中各处有引用的地方进行替换就可以。无需更改文件存放结构,防止出现更多的错误。

3.接下来讲解一下Gin框架中,如何渲染HTML文件。

engine := gin.Default()
/此处是启动我们gin框架
engine.LoadHTMLGlob("./static/html/*") 
/指明我们要加载的html文件。
/其中*代表加载 html文件夹 下面的所有html文件。 
/其中.代表我们的根目录。
/我把所有静态资源,包括html文件都放在了 static的文件夹下面。

engine.StaticFS("/static", http.Dir("./static")) 
/StaticFS 是加载目录下面所有内容。
/此函数是加载静态资源的关键。 第一个变量是为html使用的。在这里需要改为,段落1中已经说过的(将../css 替换为/stati/css)相对路径。具体内容可以你来指定。
/第二哥变量是填写你静态资源存放在计算机的哪个地址。建议填写为相对路径。我把所有静态资源,包括html文件都放在了static的文件夹下面。所以此处写为 ./static
/因为当你换另外一台计算机部署的时候,绝对路径容易出错。

engine.Run(":8080")
/将我们的框架启动起来。默认为localhost:8080. 如果你想要修改,就直接把8080修改成你想要的端口。可以在局域网里头进行测试,是非常有趣的事情。

4.接下来我们就可以完美渲染我们的网页了。

5. 当然大家不要忘记了添加我们 HTML 的GET等请求。不然浏览器会没有响应。​​​​​​​

接下来给大家看看我的目录结构。 

Go 语言 Gin 框架 Web开发 HTML 加载静态资源_第1张图片

 

你可能感兴趣的:(Go 语言 Gin 框架 Web开发 HTML 加载静态资源)