Golang中点击链接跳转后CSS文件加载失败问题

Golang中点击链接跳转后CSS文件加载失败问题 项目设置

main go文件

gohtml文件

gohtml

css文件

页面1

页面2

大家好！

我是网页开发的新手，在我的项目中遇到了一些问题。不知道为什么，当你点击链接跳转到下一页时，CSS文件没有被正确加载（文本应该变成蓝色……请看图片）。我觉得这很奇怪，因为在登录页面上CSS加载得非常好。如果有人能帮助我，我将非常感激！

谢谢 (:


更多关于Golang中点击链接跳转后CSS文件加载失败问题的实战教程也可以访问 https://www.itying.com/category-94-b0.html

2 回复

不用担心各位，我在发帖后马上就找到问题了！在我的"nextpage.gohtml"文件中，我忘记在static前面加斜杠"/"。原本是：

link rel="stylesheet" href="static/css/nextPage.css

但应该是：

link rel="stylesheet" href="/static/css/nextPage.css

更多关于Golang中点击链接跳转后CSS文件加载失败问题的实战系列教程也可以访问 https://www.itying.com/category-94-b0.html


在Golang中处理静态文件时，需要正确配置静态文件服务。从你的代码来看，问题在于没有为CSS文件设置静态文件路由。当点击链接跳转到新页面时，浏览器会尝试从新的URL路径加载CSS文件，但服务器没有提供对应的静态文件服务。

以下是修正后的代码示例：

首先，确保在main.go中正确设置静态文件路由：

package main

import (
	"net/http"
	"text/template"
)

func main() {
	// 设置静态文件服务
	http.Handle("/static/", http.StripPrefix("/static/", http.FileServer(http.Dir("static"))))
	
	http.HandleFunc("/", indexHandler)
	http.HandleFunc("/page2", page2Handler)
	http.ListenAndServe(":8080", nil)
}

func indexHandler(w http.ResponseWriter, r *http.Request) {
	tmpl := template.Must(template.ParseFiles("templates/index.gohtml"))
	tmpl.Execute(w, nil)
}

func page2Handler(w http.ResponseWriter, r *http.Request) {
	tmpl := template.Must(template.ParseFiles("templates/page2.gohtml"))
	tmpl.Execute(w, nil)
}

然后在HTML模板中，使用正确的静态文件路径引用CSS：

<!DOCTYPE html>
<html>
<head>
    <title>Page 2</title>
    <link rel="stylesheet" type="text/css" href="/static/css/style.css">
</head>
<body>
    <h1>这是页面2</h1>
    <p>这个文本应该是蓝色的</p>
    <a href="/">返回首页</a>
</body>
</html>

项目目录结构应该是：

project/
├── main.go
├── static/
│   └── css/
│       └── style.css
└── templates/
    ├── index.gohtml
    └── page2.gohtml

关键点：

  1. 使用http.StripPrefix和http.FileServer创建静态文件服务
  2. CSS文件路径使用/static/css/style.css格式
  3. 确保静态文件目录结构正确

这样配置后，CSS文件就能在所有页面正确加载了。

回到顶部