fiber静态资源路径必须与static.new()挂载点严格一致,如app.static("/assets", "./public")则只能通过/assets/logo.png访问;中间件须在static之前注册;spa需手动添加兜底路由;注意mime类型和cdn兼容性。

静态资源路径必须和 static.New() 的挂载点严格一致
如果你用 app.Static("/assets", "./public"),那浏览器访问 /assets/logo.png 才能命中;访问 /logo.png 或 /static/logo.png 都会 404。Fiber 不会自动补前缀或做路径重写。
常见错误是开发时本地直接打开 HTML 文件(file:// 协议),结果 JS/CSS 路径写成相对路径如 ./js/app.js,部署后变成请求 http://domain.com/js/app.js —— 这个路径根本没挂载,自然 404。
- 前端构建时配置
publicPath(Webpack/Vite)或base(Vue Router)为实际挂载前缀,比如/assets/ - HTML 中所有静态资源引用必须带该前缀:
<script src="/assets/js/app.js"></script> - 别依赖
index.html所在目录“就近查找”,Fiber 的静态服务只认注册的前缀路径
static.New() 和中间件的注册顺序不能错
防盗链、压缩、缓存等中间件必须在 static.New() 之前注册,否则请求被静态处理器直接响应,后续中间件完全不执行。
正确顺序:
app.Use("/assets", refererMiddleware) // 先挂中间件
app.Static("/assets", "./public") // 再挂静态服务
错误顺序(中间件失效):
app.Static("/assets", "./public")
app.Use("/assets", refererMiddleware) // 永远不会走到这里
-
app.Use("/assets", ...)是路径前缀匹配,不是正则,所以/assets/和/assets效果一样 - 如果用了 CDN 或 Nginx 反代,注意
X-Original-Referer是否透传,否则refererMiddleware拿到的是代理 IP 的 Referer - 本地开发时,
localhost和127.0.0.1是不同 hostname,白名单得都加
如何让 index.html 支持 SPA 路由回退
Fiber 默认的 Static 不处理 404 后 fallback 到 index.html,所以 Vue/React 路由刷新页面会直接 404。
解决方法是手动注册一个兜底路由,在所有静态路由之后、API 路由之前:
app.Static("/assets", "./public")
app.Get("*", func(c *fiber.Ctx) error {
return c.SendFile("./public/index.html")
})
- 这个
Get("*")必须放在Static之后,否则静态文件请求会被它拦截 - 不能放在所有路由最后,否则 API 请求(如
/api/users)也会被 fallback,导致接口返回 HTML - 如果只希望特定路径(如
/app/*)支持 SPA 回退,就把Get("/app/*")替换上面的通配符
生产环境要注意文件系统权限和 MIME 类型
Fiber 用 Go 标准库的 http.ServeContent 发送文件,但默认 MIME 类型映射有限,比如 .webp、.avif、.woff2 可能被识别为 text/plain,导致浏览器拒绝加载。
解决方案是显式设置:
app.Static("/assets", "./public", fiber.Static{
ByteRange: true,
Browse: false,
Compress: true,
CacheControl: "public, max-age=31536000",
})
-
Compress: true会自动启用 gzip/brotli(需客户端支持),但注意某些老旧 CDN 会丢掉Content-Encoding头 -
Browse: false关闭目录列表,避免敏感文件(如.env)被意外暴露 - 若仍遇到 MIME 问题,可在
SendFile前手动调用c.Type(),比如c.Type("webp")











