内容简介:server 启动以后会注册两个 Handler。
1.websocket 简介
以往浏览器要获取服务端数据,都是通过发送 HTTP 请求,然后等待服务端回应的。也就是说浏览器端一直是整个请求的发起者,只有它主动,才能获取到数据。而要让浏览器一侧能够获取到服务端的实时数据,就需要不停地向服务端发起请求。虽然大多数情况下并没有获取到实际数据,但这大大增加了网络压力,对于服务端来说压力也直线上升。
image.png
由于 WebSocket 是全双工通信,所以当建立了 WebSocket 连接之后,接下来的通信就类似于传统的 TCP 通信了。客户端和服务端可以相互发送数据,不再有实时性的问题。
image.png
image.png
2.开发包的选择
在 Go 官方的 SDK 中,并不包含对 WebSocket 的支持,所以必须使用第三方库。
要使用 Golang 开发 WebSocket,选择基本就在 x/net/websocket 和 gorilla/websocket 之间。《Go Web 编程》一书中的例子使用了 x/net/websocket
作为开发包,而且貌似它也更加官方且正式。而实际根据我在网上查询得到的反馈看来,并非如此。 x/net/websocket
貌似 Bug 较多,且较为不稳定,问题解决也并不及时。相比之下, gorilla/websocket
则更加优秀。
3.推送服务实现
server 启动以后会注册两个 Handler。
websocketHandler 用于提供浏览器端发送 Upgrade 请求并升级为 WebSocket 连接。 pushHandler 用于提供外部推送端发送推送数据的请求。
3-1.go代码的简单实现
package main import ( "net/http" "log" "github.com/gorilla/websocket" ) var ( upgrader = websocket.Upgrader { // 读取存储空间大小 ReadBufferSize:1024, // 写入存储空间大小 WriteBufferSize:1024, // 允许跨域 CheckOrigin: func(r *http.Request) bool { return true }, } ) func wsHandler(w http.ResponseWriter, r *http.Request) { var ( wbsCon *websocket.Conn err error data []byte ) // 完成http应答,在httpheader中放下如下参数 if wbsCon, err = upgrader.Upgrade(w, r, nil);err != nil { return // 获取连接失败直接返回 } for { // 只能发送Text, Binary 类型的数据,下划线意思是忽略这个变量. if _, data, err = wbsCon.ReadMessage();err != nil { goto ERR // 跳转到关闭连接 } if err = wbsCon.WriteMessage(websocket.TextMessage, data); err != nil { goto ERR // 发送消息失败,关闭连接 } } ERR: // 关闭连接 wbsCon.Close() } func main() { // 当有请求访问ws时,执行此回调方法 http.HandleFunc("/ws",wsHandler) // 监听127.0.0.1:7777 err := http.ListenAndServe("0.0.0.0:7777", nil) if err != nil { log.Fatal("ListenAndServe", err.Error()) } }
3-2.前端代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <style> *{ margin:0px; padding:0px; } </style> </head> <body> <div style="margin-left:400px"> <h3>群聊天室</h3> <div style="border:1px solid;width: 600px;height: 300px;"> <div id="msgArea" style="width:100%;height: 100%;text-align:start;resize: none;font-family: 微软雅黑;font-size: 20px;overflow-y: scroll"></div> </div> <div style="border:1px solid;width: 600px;height: 100px;"> <div style="width:100%;height: 100%;"> <textarea id="userMsg" style="width:100%;height: 100%;text-align:start;resize: none;font-family: 微软雅黑;font-size: 20px;"></textarea> </div> </div> <div style="border:1px solid;width: 600px;height: 25px;"> <button style="float: right;" onclick="sendMsg()">发送</button> </div> </div> </body> </html> <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script> <script> var ws; $(function(){ link(); }) function link () { ws = new WebSocket("ws://127.0.0.1:7777/ws");//连接服务器 ws.onopen = function(event){ console.log(event); alert('连接了'); }; ws.onmessage = function (event) { var date = new Date(); var msg = "<p>"+date.toLocaleString()+"</p>"+"<p>"+event.data+"</p>"; $("#msgArea").append(msg); } ws.onclose = function(event){alert("已经与服务器断开连接\r\n当前连接状态:"+this.readyState);}; ws.onerror = function(event){alert("WebSocket异常!");}; } function sendMsg(){ var msg = $("#userMsg").val(); ws.send(msg); } </script>
3-3. 结果分析
运行的结果
image.png
交互的过程
1.request请求时,要求将协议升级为websocket 参数
2.response返回时,如果成功则返回websocket 参数
image.png
数据传送形式是把数据拆成多个frame进行发送和接收,这个不用我们关心。
image.png
image.png
4.第三方资源
5.PHP前沿学习群: 257948349 go也收
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网
猜你喜欢:- iOS 消息推送那些事儿
- iOS 消息推送那些事儿
- 微信小程序订阅消息推送
- WebSocket 前后端实时消息推送
- 《Web 推送通知》系列翻译 | 第五篇:使用 Web 推送库发送消息 && 第六篇:Web 推送协议
- iOS 推送手机消息背后的技术
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。