在Go服务器中未呈现CSS。

huangapple go评论80阅读模式
英文:

CSS not rendered in Go server

问题

我正在使用chi作为路由器。
我的文件树如下:

-cmd
     - web
          - main.go和其他一些go文件*
          - static
                - assets
                - 这里有一些html文件*

我已经设置好了我的路由:

mux := chi.NewRouter()

mux.Use(middleware.Logger)
mux.Use(middleware.SetHeader("Cache-Control", "no-store"))

mux.Get("/about", app.serveFile)
mux.Get("/login", app.serveFile)
mux.Get("/register", app.serveFile)
mux.Get("/", app.serveFile)

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

这是我的index.html文件的一部分:

<link rel="shortcut icon" href="/assets/images/favicon.png" type="image/x-icon">
<link rel="stylesheet" href="/assets/css/style.css">

编辑1:
我正在使用make作为我的构建工具。这是构建和运行web的规则:

build_web:
	@echo "building projectName web..."
	@go build -o ${BINARY_DIR}/${WEB_BINARY_NAME} ./cmd/web/*.go
	@echo "projectName web built"

run_web:
	@echo "running projectName web..."
	@./${BINARY_DIR}/${WEB_BINARY_NAME} -environment ${PREF_ENV} -port ${WEB_PORT}

在本地主机上运行服务器时,HTML页面被渲染,但CSS样式没有应用。我检查了开发者工具的网络选项卡,显示所有资源(CSS/JS/图像)的状态码为200。中间件日志记录器也报告了同样的情况,资产文件夹中的所有文件状态码都是200。
我尝试了我能找到的所有stackoverflow答案,但仍然没有运气。

英文:

I'm using chi as router.
My files tree is:

 -cmd
     - web
          - main.go and some other go files here*
          - static
                - assets
                - some html files here*

I have my routes set up like so:

mux := chi.NewRouter()

mux.Use(middleware.Logger)
mux.Use(middleware.SetHeader(&quot;Cache-Control&quot;, &quot;no-store&quot;))

mux.Get(&quot;/about&quot;, app.serveFile)
mux.Get(&quot;/login&quot;, app.serveFile)
mux.Get(&quot;/register&quot;, app.serveFile)
mux.Get(&quot;/&quot;, app.serveFile)

fileServer := http.FileServer(http.Dir(&quot;./cmd/web/static/assets/&quot;))
	mux.Handle(&quot;/assets/&quot;, http.StripPrefix(&quot;/assets/&quot;, fileServer))

Here is a snippet of my index.html file:

 &lt;link rel=&quot;shortcut icon&quot; href=&quot;/assets/images/favicon.png&quot; type=&quot;image/x-icon&quot;&gt;
 &lt;link rel=&quot;stylesheet&quot; href=&quot;/assets/css/style.css&quot;&gt;

Edit 1:
I'm using make as my build tool. Here is the rule to build and run the web:

build_web:
	@echo &quot;building projectName web...&quot;
	@go build -o ${BINARY_DIR}/${WEB_BINARY_NAME} ./cmd/web/*.go
	@echo &quot;projectName web built&quot;

run_web:
	@echo &quot;running projectName web...&quot;
	@./${BINARY_DIR}/${WEB_BINARY_NAME} -environment ${PREF_ENV} -port ${WEB_PORT}

Running the server on localhost, HTML pages are rendered but css rules are not applied. I checked the network tab of developer tools and it shows status code 200 for all assets (css/js/images). Same was reported through the middleware logger, a 200 status code for all files in the assets folder.
I've tried all stackoverflow answers I could stumble upon, still no luck.

答案1

得分: 1

我最终是如何解决这个问题的:
我在浏览器中输入<address>/assets/css/style.css,返回了404页面未找到的错误。
尽管服务器日志显示状态码为200,但实际上文件并没有被提供。所以我将文件服务器上的路径从/assets/改为/assets/*(这里是mux.Handle("/assets/*", http.StripPrefix("/assets/", fileServer))),然后问题就解决了。
感谢@bayta-darrel和@mkopriva的帮助。

英文:

How I eventually fixed this:
I entered &lt;address&gt;/assets/css/style.css in my browser and it returned 404 not found page.
Though it shows a status code 200 in the server log, but the file was not actually served. So I changed the path on my fileserver from /assets/ to /assets/* (here: mux.Handle(&quot;/assets/*&quot;, http.StripPrefix(&quot;/assets/&quot;, fileServer))) and it worked,
Thanks to @bayta-darrel and @mkopriva for their help

huangapple
  • 本文由 发表于 2022年2月4日 14:41:42
  • 转载请务必保留本文链接:https://go.coder-hub.com/70982386.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定