Question

我正在使用Go运行http服务器实例，我想将HTML文档返回给客户端，但JS和CSS文件无效。如果JS和CSS与HTML一起发送，如果它们位于不同的文件中，我该怎么做？

转码

package main
import (
"fmt"
"io/ioutil"
"net/http"
)

func main() {
    http.HandleFunc("/", handler)
    http.ListenAndServe(":8080", nil)
}

func handler(w http.ResponseWriter, r *http.Request) {
    w.Header().Set("Content-Type", "text/html")
    file, _ := ioutil.ReadFile("webpage.html")
    s := string(file)
    fmt.Fprintf(w, s)
}

webpage.html

<!DOCTYPE HTML>
<html lang="en">
    <head>
        <meta charset="UTF-8"/>
        <title>html file</title>
        <link rel="stylesheet" type"text/css" href="styles.css"/>
    </head>
    <body>
        <h1>Click to change color</h1>
        <script src="changeColor.js"></script>
    </body>
</html>

和changeColor.js

function init(){
var h1tags = document.getElementsByTagName("h1");
h1tags[0].onclick = changeColor;
}

function changeColor(){
    this.style.color = '#000000';
}
onload = init;

CSS位于名为styles.css的文件中，与HTML文档位于同一目录中。

Answer 1

在Go代码中，您需要这样做：

func main() {
http.HandleFunc("/", handler)

http.HandleFunc("/changeColor.js", func(w http.ResponseWriter, r *http.Request) {
    http.ServeFile(w, r, "changeColor.js")
})

http.HandleFunc("/styles.css", func(w http.ResponseWriter, r *http.Request) {
    http.ServeFile(w, r, "styles.css")
})

http.ListenAndServe(":8080", nil)
}

因为这行的服务器

    <link rel="stylesheet" type"text/css" href="styles.css"/>

查看此模式“/styles.css”，您的服务器无法处理此请求。

您可以替换此代码

http.HandleFunc("/", handler)

白衣

http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
    http.ServeFile(w, r, "webpage.html")
})

Answer 2

您可以设置文件服务器来处理静态内容（例如css，js，img）。例如，您有一个目录结构如下。

   static     
      css
        styles.css
      js
        changeColor.js

.parent-div {
  height: 370px;
  overflow: auto;
  overflow-x: hidden;
  padding-right: 25px;
  margin-bottom: 7px;

  &:nth-child(n+1) ~ div {
    height: auto;
    overflow: hidden;
  }
}

您可以在HTML文件中访问CSS和js，如下所示

func main() {
    http.Handle("/static/", http.StripPrefix("/static/", http.FileServer(http.Dir("static"))))
   // other handlers
    http.ListenAndServe(":8080", nil)
}

Answer 3

以下是工作代码的示例：

package main

import (
    "fmt"
    "io/ioutil"
    "net/http"

    "log"
)

func main() {
    http.HandleFunc("/", handler)
    http.ListenAndServe(":8080", nil)
}

func handler(w http.ResponseWriter, r *http.Request) {
    log.Println("Got request:", r.URL.Path)

    var contentType string
    var fileName string

    switch r.URL.Path {
    case "/":
        contentType = "text/html"
        fileName = "webpage.html"

    case "/changeColor.js":
        contentType = "text/javascript"
        fileName = "changeColor.js"

    case "/styles.css":
        contentType = "text/css"
        fileName = "styles.css"

    default:
        w.WriteHeader(http.StatusBadRequest)
        log.Println("Bad request (unknown file)")
        return
    }

    file, err := ioutil.ReadFile(fileName)
    if err != nil {
        w.WriteHeader(http.StatusNotFound)
        log.Println("File not found")
        return
    }

    w.Header().Set("Content-Type", contentType)
    s := string(file)
    fmt.Fprintf(w, s)
}

在HTML文档中包含JS和CSS？

3 个答案: