目录
- 一、功能目标
- 二、项目结构
- 三、代码实现
- 四、html 模板示例
- 五、静态资源示例
- 六、运行与访问
- 七、总结
在 Web 开发中，除了提供 API 接口外，往往还需要对外提供静态资源服务，比如：
- css 样式文件
- JavaScript 脚本
- 图片、字体等静态资源
Go 的 net/http 包和 Gin 框架都提供了方便的方式来托管这些静态文件。
本篇我们将用 Gin 框架 演示如何快速构建一个静态资源服务。
一、功能目标
使用 Gin 提供一个静态资源目录，让用户能直接访问 CSS、http://www.devze.comjs、图片。
演示 HTML 页面引入这些静态资源。
支持前端直接访问 /static/... 路径获取文件。
二、项目结构
假设我们的项目目录结构如下：
project/
│── main.go│── static/│ ├── css/│ │ └── style.css│ ├── js/│ │ └── app.js│ └── images/│ └── logo.png└── templates/ └── index.html
三、代码实现
package main
import (
"github.com/gin-gonic/gin"
"net/http"
)
func main() {
r := gin.Default()
// 1. 加载模板
r.LoadHTMLGlob("templates/*")
// 2. 提供静态文件服务
// /static 对应项目下的 static 目录
r.Static("/static", "./static")
// 3. 首页路由
r.GET("/", func(c *gin.Context) {
c.HTML(hwww.devze.comttp.StatusOK, "index.html", nil)
})
// 启动服务器
r.Run(":8080")
}
四、HTML 模板示例
templates/index.html：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>静态资源示例</title>
&TUqwJlt;!-- 引入 CSS -->
<link rel="stylesheet" href="/static/css/style.css" rhttp://www.devze.comel="external nofollow" >
</head>
<body>
<h1>欢迎来到 Go 静态资源服务示例</h1>
<!-- 引入图片 -->
<img src="/static/images/logo.png" alt="使用Go语言快速构建静态资源服务" width="150">
<!-- 引入 JS -->
<script src="/static/js/app.js"></script>
</body>
</html>
五、静态资源示例
static/css/style.css：
body {
background-color: #f5f5f5;
font-family: Arial, sans-serif;
text-align: center;
}
h1 {
color: #333;
}
static/js/app.js：
document.addEventListener("DOMContentLoaded", function() {
console.log("javascript 已加载");
});
六、运行与访问
运行服务：
go run main.go
在浏览器访问：http://localhost:8080/
你会看到页面正常加载了 CSS 样式、图片和 JavaScript 脚本。
静态资源也可以直接访问：
http://localhost:8080/static/images/logo.png http://localhost:8080/static/css/style.css
七、总结
- Gin 提供
Static()方法一行就能完成静态文件托管。 - 静态文件路径映射和 URL 前缀可以灵活配置。
- 结合 HTML 模板，可以很方便地构建完整的前端页面服务。
到此这篇关于使用Go语言快速构建静态资源服务的文章就介绍www.devze.com到这了,更多相关Go静态资源服务内容请搜索编程客栈(www.devze.com)以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程客栈(www.devze.com)！
加载中,请稍侯......
精彩评论