如何在Chi Router的受保护路由下提供静态文件（尤其是图片）？

问题根源是HTML中使用了相对路径./static/images/img.png，当页面位于/user/profile这类嵌套路由下时，浏览器会以当前URL的父路径/user/作为基准解析相对路径，导致资源请求路径变成/user/static/images/img.png，与实际静态资源的根路径不符。

以下是两种简单的解决方法：

方法一：使用绝对路径直接指定资源位置 #

修改HTML中的图片路径，去掉开头的./，改用从网站根目录开始的绝对路径：

<img src="/static/images/img.png" />

这样无论当前页面处于哪个路由层级，浏览器都会直接从根路径/开始请求静态资源，确保路径正确指向http://localhost:8080/static/images/img.png。

方法二：通过<base>标签统一设置路径基准 #

在HTML的<head>标签中添加<base>标签，指定页面中所有相对路径的基准为网站根目录：

<head>
  <base href="/" />
</head>

设置后，页面中原本的相对路径./static/images/img.png会自动基于/解析为/static/images/img.png，无需逐个修改资源路径，适合页面中有大量静态资源的场景。

另外可以确认你的Chi Router静态资源配置本身是正确的：

fileServer := http.FileServer(http.Dir("./static/"))
mux.Handle("/static/*", http.StripPrefix("/static", fileServer))

该配置已在根路由上正确注册了静态资源服务，只要请求路径正确就能正常访问。

内容的提问来源于stack exchange，提问作者kouhadi