go语言websocket使用与客户端html5调用

时间:2022-08-28 01:51:03

我们通过使用如下库创建websocket服务

go get golang.org/x/net/websocket

websocket服务端的代码如下:

package main;

import (
"golang.org/x/net/websocket"
"net/http"
"log"
"fmt"
) //使用golang.org/x/net/websocket
//如果无法下载,请到下面的地址去下载
//http://www.golangtc.com/download/package
//http://gopm.io/ type Msg struct {
From string;
To string;
Data string;
} //处理简单的字符串
func test(conn *websocket.Conn) {
var err error;
for {
data := "";
//接收消息
err = websocket.Message.Receive(conn, &data);
if err != nil {
break;
}
fmt.Println("client send: " + data); msg := "hello " + data;
//发送消息
err = websocket.Message.Send(conn, msg);
if err != nil {
break;
}
}
} //处理JSON数据
func test2(conn *websocket.Conn) {
var err error;
for {
var data Msg;
//接收消息
err = websocket.JSON.Receive(conn, &data);
if err != nil {
break;
}
fmt.Println(data.From, data.To, data.Data); msg := Msg{
From: data.From,
To: data.To,
Data: "hello " + data.Data,
};
//发送消息
err = websocket.JSON.Send(conn, msg);
if err != nil {
break;
}
}
} func main() {
//http.Handle("/", websocket.Handler(test));
http.Handle("/", websocket.Handler(test2));
err := http.ListenAndServe(":8080", nil);
if err != nil {
log.Fatal(err);
}
}

html客户端代码如下:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>websocket</title>
</head>
<body>
<form>
<input type="text" id="msg">
<input type="submit" id="sendBtn" value="发送">
</form>
<div id="result"></div>
<script type="text/javascript">
var url = "ws://127.0.0.1:8080";
var ws = new WebSocket(url);
//ws打开时
ws.onopen = function() {
console.log("connect ...");
};
//ws连接关闭时
ws.onclose = function() {
console.log("close");
};
//监听服务器推送数据
ws.onmessage = function(ev) {
var result = document.getElementById("result");
result.innerHTML = result.innerHTML + "<p>" + ev.data + "</p>";
}; document.getElementById("sendBtn").onclick = function() {
var msg = document.getElementById("msg").value;
if(msg.length == 0) {
alert("不能为空");
}
//发送数据
ws.send(msg);
return false;
};
</script>
</body>
</html>

go语言websocket使用与客户端html5调用

go语言websocket使用与客户端html5调用

json格式:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>websocket</title>
</head>
<body>
<form>
<input type="text" id="msg">
<input type="submit" id="sendBtn" value="发送">
</form>
<div id="result"></div>
<script type="text/javascript">
var url = "ws://127.0.0.1:8080";
var ws = new WebSocket(url);
//ws打开时
ws.onopen = function() {
console.log("connect ...");
};
//ws连接关闭时
ws.onclose = function() {
console.log("close");
};
//监听服务器推送数据
ws.onmessage = function(ev) {
var result = document.getElementById("result");
var data = eval("(" + ev.data + ")");
result.innerHTML = result.innerHTML + "<p>" + data.From + "发送" + data.To + ":" + data.Data + "</p>";
}; document.getElementById("sendBtn").onclick = function() {
var msg = document.getElementById("msg").value;
if(msg.length == 0) {
alert("不能为空");
}
//发送数据
//注意这里JOSN的拼接,key和value要用双引号,否则go无法解析
ws.send('{"From":"小张","To":"小王","Data":"' + msg + '"}');
return false;
};
</script>
</body>
</html>

go语言websocket使用与客户端html5调用

go语言websocket使用与客户端html5调用