Html 使用本地版本时丢失引导格式_Html_Go_Bootstrap 4

Html 使用本地版本时丢失引导格式

html go bootstrap-4

Html 使用本地版本时丢失引导格式,html,go,bootstrap-4,Html,Go,Bootstrap 4,我正在编写我的第一个web服务器，所以不要讨厌它我正在使用Golang和HTML与引导这个程序最终将在一个小设备的树莓Pi上运行。所以我认为最好使用下载的引导版本，而不是CDN版本，对吗但当我这样做时，我页面上的按钮会丢失格式以下是我使用CDN版本的HTML代码： <!DOCTYPE html> <html lang="en"> <head> <title>Cacophonator Setup</title> <m

我正在编写我的第一个web服务器，所以不要讨厌它

我正在使用Golang和HTML与引导

这个程序最终将在一个小设备的树莓Pi上运行。所以我认为最好使用下载的引导版本，而不是CDN版本，对吗

但当我这样做时，我页面上的按钮会丢失格式

以下是我使用CDN版本的HTML代码：

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Cacophonator Setup</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h2>Cacophonator Setup</h2>
  <div class="col-sm-12">
        <!-- <a href="\CameraPositioning\" class="btn btn-primary" type="button">Camera Positioning</a> -->
    <button type="button" class="btn btn-primary" onclick="location.href='camera-positioning.html'">Camera Positioning</button>
  </div>
  <div class="col-sm-12">
        <button type="button" class="btn btn-primary" onclick="location.href='3G-connectivity.html'">3G Connectivity</button>
  </div>        
  <div class="col-sm-12">
      <button type="button" class="btn btn-primary" onclick="location.href='API-server.html'">API Server</button>
  </div>
  <div class="col-sm-12">
    <button type="button" class="btn btn-primary" onclick="location.href='network-interfaces.html'">Network Interfaces</button>
  </div>

  <div class="col-sm-12">
    <button type="button" class="btn btn-primary" onclick="location.href='disk-memory.html'">Disk and Memory Status</button>
  </div>

</div>

<h4>{{.Head}}<h4>

</body>
</html>

IndexHandler是这样的：

http.HandleFunc("/", managementinterface.IndexHandler)
log.Fatal(http.ListenAndServe(":8080", nil))

func IndexHandler(w http.ResponseWriter, r *http.Request) {

    t, _ := template.ParseFiles("../html/index.html")
    t.Execute(w, "")

}

最后一点注意：CDN版本是3.3.7，我下载的版本是4.1.1

另外，如果我查看本地引导CSS文件，我可以看到：

.btn-primary {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}

这是我想要的款式。感谢您的帮助。

您是否真的从Go代码中提供JS和CSS代码？如果没有，您的浏览器会向Go HTTP服务器请求资源，但它不知道您在说什么（如果您查看浏览器中的开发人员控制台，它将向您显示对这些文件请求的404响应）

您可能需要执行以下操作（假设您的CSS和JS位于名为assets的目录中）

更多信息，请访问

这个开源项目的其他人回答了这个问题

他们所做的是将所有静态css和html页面打包到Go可执行文件中。他们使用了一个名为packr的包：

这是一个为你做这件事的工具

那么你只有一个文件要部署，这真的很好。

你为什么要使用相对URL？@MichaelHampton Umm我不确定。你是指引导文件还是HTML文件？例如，你有一个相对的

。你没有把前导的

放在上面。为什么不呢？我真的不知道Michael。它有一个前导的“/”字符仍然是相对路径，不是吗？但它需要相对路径，不是吗？不能有类似“C:\user\go\…”的内容使用前导的

它是相对于web服务器文档根的。如果没有前导的

，它是相对于当前URL的路径的，这通常不是您想要的。谢谢，我明天将对此进行研究。尽管这一问题已经解决，但仍然需要了解更多有关这方面的信息。

.btn-primary {
  color: #fff;
  background-color: #007bff;
  border-color: #007bff;
}

cssFs := http.FileServer(http.Dir("/home/user/www/assets/css"))
http.Handle("/css", fs)
jsFs := http.FileServer(http.Dir("/home/user/www/assets/js"))
http.Handle("/js", fs)