一、后端部分
要想使用ajax,先要准备一个func (http.ResponseWriter, *http.Request)类型的函数来处理前端发过来的请求。
func OnAjax(res http.ResponseWriter, req *http.Request) { io.WriteString(res, "这是从后台发送的数据") }
接下来,要把一个网址和它对应起来,例如主页下的“/ajax”:
http.HandleFunc("/ajax", OnAjax)
二、HTML部分
网页上的内容很简单,只有一个按钮和一个文字输入框。
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta charset="utf-8" /> <title>Go语言与ajax示例</title> <script type="text/javascript" src="js/loli.js"></script> </head> <body> <p><input id="btn1" type="button" value="按钮" /></p> <p><input id="txt1" type="text" /></p> </body> </html>
三、js部分
这部分没什么好说的,就是XMLHttpRequest那点事。
window.onload = main; function main() { var oBtn = document.getElementById('btn1'); oBtn.onclick = OnButton1; } function OnButton1() { var xhr = new XMLHttpRequest(); xhr.open('get', '/ajax', true); xhr.send(); xhr.onreadystatechange = function () { if (xhr.readyState == 4) { // 读取完成 if (xhr.status == 200) { var oTxt = document.getElementById('txt1'); oTxt.value = xhr.responseText; } } } }
收到服务器传过来的数据后,在输入框上就可以看到文字了。
四、完整Go代码
package main import ( "bytes" "errors" "fmt" "html/template" "io" "net/http" "runtime" ) // 端口 const ( HTTP_PORT string = "80" HTTPS_PORT string = "443" ) // 目录 const ( CSS_CLIENT_PATH = "/css/" DART_CLIENT_PATH = "/js/" IMAGE_CLIENT_PATH = "/image/" CSS_SVR_PATH = "web" DART_SVR_PATH = "web" IMAGE_SVR_PATH = "web" ) func init() { runtime.GOMAXPROCS(runtime.NumCPU()) } func main() { // 先把css和脚本服务上去 http.Handle(CSS_CLIENT_PATH, http.FileServer(http.Dir(CSS_SVR_PATH))) http.Handle(DART_CLIENT_PATH, http.FileServer(http.Dir(DART_SVR_PATH))) // 网址与处理逻辑对应起来 http.HandleFunc("/", HomePage) http.HandleFunc("/ajax", OnAjax) // 开始服务 err := http.ListenAndServe(":"+HTTP_PORT, nil) if err != nil { fmt.Println("服务失败 /// ", err) } } func WriteTemplateToHttpResponse(res http.ResponseWriter, t *template.Template) error { if t == nil || res == nil { return errors.New("WriteTemplateToHttpResponse: t must not be nil.") } var buf bytes.Buffer err := t.Execute(&buf, nil) if err != nil { return err } res.Header().Set("Content-Type", "text/html; charset=utf-8") _, err = res.Write(buf.Bytes()) return err } func HomePage(res http.ResponseWriter, req *http.Request) { t, err := template.ParseFiles("web/loli.html") if err != nil { fmt.Println(err) return } err = WriteTemplateToHttpResponse(res, t) if err != nil { fmt.Println(err) return } } func OnAjax(res http.ResponseWriter, req *http.Request) { io.WriteString(res, "这是从后台发送的数据") }
有疑问加站长微信联系(非本文作者)