在 Go 模板中包含 js 文件
Include js file in Go template
我最近开始学习围棋。我得到了一个像网络应用程序一样的样本。我有：
/* tick-tock.go */
package main
import (
"fmt"
"io/ioutil"
"log"
"net/http"
)
// Content for the main html page..
var page = `<html>
<head>
<script type="text/javascript"
src="http://localhost:8081/jquery.min.js">
</script>
<style>
div {
font-family: "Times New Roman", Georgia, Serif;
font-size: 1em;
width: 13.3em;
padding: 8px 8px;
border: 2px solid #2B1B17;
color: #2B1B17;
text-shadow: 1px 1px #E5E4E2;
background: #FFFFFF;
}
</style>
</head>
<body>
<h2 align=center>Go Timer </h2>
<div id="output" style="width: 30%; height: 63%; overflow-y: scroll; float:left;"></div>
<div id="v1" style="width: 50%; height: 30%; overflow-y: scroll; float:left;"></div>
<div id="v2" style="width: 50%; height: 30%; overflow-y: scroll; float:left;"></div>
<input id="sett" type="submit" name="sett" value="Settings" onclick="changeUrl()">
<script type="text/javascript">
var myDelay;
$(document).ready(function ()
{
$("#output").append("Waiting for system time..");
myDelay = setInterval("delayedPost()", 1000);
});
function delayedPost()
{
$.post("http://localhost:9999/dev", "", function(data, status)
{
//$("#output").empty();
$("#output").prepend(data);
});
$.post("http://localhost:9999/v1", "", function(data, status) {
//$("#output").empty();
$("#v1").prepend(data);
});
$.post("http://localhost:9999/v2", "", function(data, status) {
//$("#output").empty();
$("#v2").prepend(data);
});
}
function delayedPost1()
{
$.post("http://localhost:9999/dev", "", function(data, status)
{
$("#output").prepend(data);
});
$.post("http://localhost:9999/v1", "", function(data, status)
{
$("#v1").prepend(data);
});
$.post("http://localhost:9999/v3", "", function(data, status)
{
$("#v2").prepend(data);
});
}
function changeUrl()
{
alert('salom');
clearInterval(myDelay);
}
</script>
</body>
</html>`
// handler for the main page.
func handler(w http.ResponseWriter, r *http.Request) {
fmt.Fprint(w, page)
}
// handler to cater AJAX requests
func handlerDevs(w http.ResponseWriter, r *http.Request) {
//fmt.Fprint(w, time.Now().Format("Mon, 02 Jan 2006 15:04:05 MST"))
fmt.Fprint(w, "<font color=red>Dev1<br></font>")
}
func handlerV1(w http.ResponseWriter, r *http.Request) {
//fmt.Fprint(w, time.Now().Format("Mon, 02 Jan 2006 15:04:05 MST"))
fmt.Fprint(w, "<font color=blue>Vertical1<br></font>")
}
func handlerV2(w http.ResponseWriter, r *http.Request) {
//fmt.Fprint(w, time.Now().Format("Mon, 02 Jan 2006 15:04:05 MST"))
fmt.Fprint(w, "<font color=green>Vertical2<br></font>")
}
func main() {
http.HandleFunc("/", handler)
http.HandleFunc("/dev", handlerDevs)
http.HandleFunc("/v1", handlerV1)
http.HandleFunc("/v2", handlerV2)
log.Fatal(http.ListenAndServe(":9999", nil))
http.HandleFunc("/jquery.min.js", SendJqueryJs)
panic(http.ListenAndServe(":8081", nil))
}
func SendJqueryJs(w http.ResponseWriter, r *http.Request) {
data, err := ioutil.ReadFile("jquery.min.js")
if err != nil {
http.Error(w, "Couldn't read file", http.StatusInternalServerError)
return
}
w.Header().Set("Content-Type", "application/javascript")
w.Write(data)
}
我无法加载本地 jquery.min.js。当我写 src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" 时它被加载了。如何加载本地js文件？我不擅长用 Go 编写代码，也没有编写完整的代码。所以请尽量解释得非常简单。提前致谢！
您需要一个 Handler or a HandlerFunc，它将在请求时将文件内容 (jquery.min.js) 发送到 Web 浏览器。
您有 3 个选项：
手动执行
这是更复杂的解决方案。看起来在您的处理程序函数中您读取了文件的内容，设置了正确的响应内容类型 (application/javascript) 并将内容（[]byte）发送到响应。
注意事项：读取文件时，必须指定绝对路径。如果您指定相对路径，请确保该文件位于您启动应用程序的当前文件夹（工作目录）中。
示例：
func SendJqueryJs(w http.ResponseWriter, r *http.Request) {
data, err := ioutil.ReadFile("jquery.min.js")
if err != nil {
http.Error(w, "Couldn't read file", http.StatusInternalServerError)
return
}
w.Header().Set("Content-Type", "application/javascript; charset=utf-8")
w.Write(data)
}
func main() {
http.HandleFunc("/jquery.min.js", SendJqueryJs)
panic(http.ListenAndServe(":8081", nil))
}
以上示例只能提供 1 个文件：jquery.min.js 请求：
http://localhost:8081/jquery.min.js
利用http.ServeFile()
这就简单多了：函数http.ServeFile()可以将一个文件的内容发送到指定的响应。您仍然需要创建一个函数或处理程序来使用它，但它会为您完成剩下的工作：
func SendJqueryJs(w http.ResponseWriter, r *http.Request) {
http.ServeFile(w, r, "jquery.min.js")
}
利用http.FileServer()
如果您需要提供多个静态文件，这就是 FileServer() 函数派上用场的地方 returns 您 Handler 它会自动提供本地文件系统中的后代文件您指定的根文件夹。
此解决方案更加灵活：它可以发送多种类型的多个文件，自动检测和设置内容类型。该处理程序还能够呈现 HTML 页面，用于列出带有 link 文件和 parent/child 文件夹的目录内容。
示例：
http.Handle("/tmpfiles/",
http.StripPrefix("/tmpfiles/", http.FileServer(http.Dir("/tmp"))))
这将在 URL /tmpfiles/ 注册一个 Handler，它提供在 /tmp 文件夹中的本地文件系统中找到的文件。例如下面的 <script> link:
<script type="text/javascript" src="/tmpfiles/jquery.min.js">
将从服务器获取 /tmp/jsquery.min.js 文件。
查看此答案，其中详细说明了如何 use/fire 创建一个 。
我最近开始学习围棋。我得到了一个像网络应用程序一样的样本。我有：
/* tick-tock.go */
package main
import (
"fmt"
"io/ioutil"
"log"
"net/http"
)
// Content for the main html page..
var page = `<html>
<head>
<script type="text/javascript"
src="http://localhost:8081/jquery.min.js">
</script>
<style>
div {
font-family: "Times New Roman", Georgia, Serif;
font-size: 1em;
width: 13.3em;
padding: 8px 8px;
border: 2px solid #2B1B17;
color: #2B1B17;
text-shadow: 1px 1px #E5E4E2;
background: #FFFFFF;
}
</style>
</head>
<body>
<h2 align=center>Go Timer </h2>
<div id="output" style="width: 30%; height: 63%; overflow-y: scroll; float:left;"></div>
<div id="v1" style="width: 50%; height: 30%; overflow-y: scroll; float:left;"></div>
<div id="v2" style="width: 50%; height: 30%; overflow-y: scroll; float:left;"></div>
<input id="sett" type="submit" name="sett" value="Settings" onclick="changeUrl()">
<script type="text/javascript">
var myDelay;
$(document).ready(function ()
{
$("#output").append("Waiting for system time..");
myDelay = setInterval("delayedPost()", 1000);
});
function delayedPost()
{
$.post("http://localhost:9999/dev", "", function(data, status)
{
//$("#output").empty();
$("#output").prepend(data);
});
$.post("http://localhost:9999/v1", "", function(data, status) {
//$("#output").empty();
$("#v1").prepend(data);
});
$.post("http://localhost:9999/v2", "", function(data, status) {
//$("#output").empty();
$("#v2").prepend(data);
});
}
function delayedPost1()
{
$.post("http://localhost:9999/dev", "", function(data, status)
{
$("#output").prepend(data);
});
$.post("http://localhost:9999/v1", "", function(data, status)
{
$("#v1").prepend(data);
});
$.post("http://localhost:9999/v3", "", function(data, status)
{
$("#v2").prepend(data);
});
}
function changeUrl()
{
alert('salom');
clearInterval(myDelay);
}
</script>
</body>
</html>`
// handler for the main page.
func handler(w http.ResponseWriter, r *http.Request) {
fmt.Fprint(w, page)
}
// handler to cater AJAX requests
func handlerDevs(w http.ResponseWriter, r *http.Request) {
//fmt.Fprint(w, time.Now().Format("Mon, 02 Jan 2006 15:04:05 MST"))
fmt.Fprint(w, "<font color=red>Dev1<br></font>")
}
func handlerV1(w http.ResponseWriter, r *http.Request) {
//fmt.Fprint(w, time.Now().Format("Mon, 02 Jan 2006 15:04:05 MST"))
fmt.Fprint(w, "<font color=blue>Vertical1<br></font>")
}
func handlerV2(w http.ResponseWriter, r *http.Request) {
//fmt.Fprint(w, time.Now().Format("Mon, 02 Jan 2006 15:04:05 MST"))
fmt.Fprint(w, "<font color=green>Vertical2<br></font>")
}
func main() {
http.HandleFunc("/", handler)
http.HandleFunc("/dev", handlerDevs)
http.HandleFunc("/v1", handlerV1)
http.HandleFunc("/v2", handlerV2)
log.Fatal(http.ListenAndServe(":9999", nil))
http.HandleFunc("/jquery.min.js", SendJqueryJs)
panic(http.ListenAndServe(":8081", nil))
}
func SendJqueryJs(w http.ResponseWriter, r *http.Request) {
data, err := ioutil.ReadFile("jquery.min.js")
if err != nil {
http.Error(w, "Couldn't read file", http.StatusInternalServerError)
return
}
w.Header().Set("Content-Type", "application/javascript")
w.Write(data)
}
我无法加载本地 jquery.min.js。当我写 src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" 时它被加载了。如何加载本地js文件？我不擅长用 Go 编写代码，也没有编写完整的代码。所以请尽量解释得非常简单。提前致谢！
您需要一个 Handler or a HandlerFunc，它将在请求时将文件内容 (jquery.min.js) 发送到 Web 浏览器。
您有 3 个选项：
手动执行
这是更复杂的解决方案。看起来在您的处理程序函数中您读取了文件的内容，设置了正确的响应内容类型 (application/javascript) 并将内容（[]byte）发送到响应。
注意事项：读取文件时，必须指定绝对路径。如果您指定相对路径，请确保该文件位于您启动应用程序的当前文件夹（工作目录）中。
示例：
func SendJqueryJs(w http.ResponseWriter, r *http.Request) {
data, err := ioutil.ReadFile("jquery.min.js")
if err != nil {
http.Error(w, "Couldn't read file", http.StatusInternalServerError)
return
}
w.Header().Set("Content-Type", "application/javascript; charset=utf-8")
w.Write(data)
}
func main() {
http.HandleFunc("/jquery.min.js", SendJqueryJs)
panic(http.ListenAndServe(":8081", nil))
}
以上示例只能提供 1 个文件：jquery.min.js 请求：
http://localhost:8081/jquery.min.js
利用http.ServeFile()
这就简单多了：函数http.ServeFile()可以将一个文件的内容发送到指定的响应。您仍然需要创建一个函数或处理程序来使用它，但它会为您完成剩下的工作：
func SendJqueryJs(w http.ResponseWriter, r *http.Request) {
http.ServeFile(w, r, "jquery.min.js")
}
利用http.FileServer()
如果您需要提供多个静态文件，这就是 FileServer() 函数派上用场的地方 returns 您 Handler 它会自动提供本地文件系统中的后代文件您指定的根文件夹。
此解决方案更加灵活：它可以发送多种类型的多个文件，自动检测和设置内容类型。该处理程序还能够呈现 HTML 页面，用于列出带有 link 文件和 parent/child 文件夹的目录内容。
示例：
http.Handle("/tmpfiles/",
http.StripPrefix("/tmpfiles/", http.FileServer(http.Dir("/tmp"))))
这将在 URL /tmpfiles/ 注册一个 Handler，它提供在 /tmp 文件夹中的本地文件系统中找到的文件。例如下面的 <script> link:
<script type="text/javascript" src="/tmpfiles/jquery.min.js">
将从服务器获取 /tmp/jsquery.min.js 文件。
查看此答案，其中详细说明了如何 use/fire 创建一个