js實現webSocket客戶端
1. websocket
由於http請求只能由客戶端發起,所有當伺服器資源有變化時,客戶端只能通過輪詢的方式。非常浪費資源。websocket的特點:- 伺服器可以主動向客戶端推送資訊,客戶端也可以主動向伺服器傳送資訊,是真正的雙向平等對話,屬於伺服器推送技術的一種
- 建立在 TCP 協議之上,伺服器端的實現比較容易
- 可以傳送文字,也可以傳送二進位制資料
- 沒有同源限制,客戶端可以與任意伺服器通訊
- 協議識別符號是ws(如果加密,則為wss),伺服器網址就是 URL。如ws:localhost:8080/msg
2. 簡單示例
var ws = new WebSocket("ws://localhost:8080/msg"); ws.onopen = function(evt) { console.log("Connection open ..."); ws.send("Hello WebSockets!"); }; ws.onmessage = function(evt) { console.log("Received Message: " + evt.data); ws.close(); }; ws.onclose = function(evt) { console.log("Connection closed."); };
3. api
1. websocket建構函式
用於建立一個webSocket例項,執行後,客戶端就會與服務端連線var ws = new WebSocket("ws://localhost:8080/msg");
2. webSocket.readyState
readyState屬性返回例項物件的當前狀態,共有四種。- CONNECTING:值為0,表示正在連線。
- OPEN:值為1,表示連線成功,可以通訊了。
- CLOSING:值為2,表示連線正在關閉。
- CLOSED:值為3,表示連線已經關閉,或者開啟連線失敗
3. webSocket.onopen
用於指定連線成功後的回撥函式ws.onopen = function(evt) {
console.log("Connection open ...");
ws.send("Hello WebSockets!");
};
或者:ws.addEventListener('open', function (event) {
ws.send('Hello Server!');
});
4. webSocket.onclose
用於指定連線關閉後的回撥函式。ws.onclose = function(event) { var code = event.code; var reason = event.reason; var wasClean = event.wasClean; }; ws.addEventListener("close", function(event) { var code = event.code; var reason = event.reason; var wasClean = event.wasClean; });
5. webSocket.onmessage
用於指定收到伺服器資料後的回撥函式ws.onmessage = function(event) {
var data = event.data;
};
ws.addEventListener("message", function(event) {
var data = event.data;
});
伺服器資料有可能是文字,也有可能是二進位制資料,需要判斷
ws.onmessage = function(event){
if(typeof event.data === String) {
console.log("Received data string");
}
if(event.data instanceof ArrayBuffer){
var buffer = event.data;
console.log("Received arraybuffer");
}
}
除了動態判斷收到的資料型別,也可以使用binaryType屬性,顯式指定收到的二進位制資料型別// 收到的是 blob 資料
ws.binaryType = "blob";
ws.onmessage = function(e) {
console.log(e.data.size);
};
// 收到的是 ArrayBuffer 資料
ws.binaryType = "arraybuffer";
ws.onmessage = function(e) {
console.log(e.data.byteLength);
};
6. webSocket.send()
send方法用於向伺服器傳送資料- 傳送文字
ws.send("Hello WebSockets!");
- 傳送Blob資料
var file = document
.querySelector('input[type="file"]')
.files[0];
ws.send(file);
- 傳送ArrayBuffer
var img = canvas_context.getImageData(0, 0, 400, 320);
var binary = new Uint8Array(img.data.length);
for (var i = 0; i < img.data.length; i++) {
binary[i] = img.data[i];
}
ws.send(binary.buffer);
7. webSocket.bufferedAmount
bufferedAmount屬性,表示還有多少位元組的二進位制資料沒有傳送出去。它可以用來判斷髮送是否結束var data = new ArrayBuffer(10000000);
socket.send(data);
if (socket.bufferedAmount === 0) {
// 傳送完畢
} else {
// 傳送還沒結束
}
8. webSocket.onerror
用於指定報錯時的回撥函式ws.onerror = function(event) {
};
es.addEventListener("error", function(event) {
});
相關推薦
js實現webSocket客戶端
1. websocket由於http請求只能由客戶端發起,所有當伺服器資源有變化時,客戶端只能通過輪詢的方式。非常浪費資源。websocket的特點:伺服器可以主動向客戶端推送資訊,客戶端也可以主動向伺
C/C++ 實現websocket客戶端
網上有一個現存的開源庫,websocketpp,但好像不太適合目前開發的專案,好在是開源庫,可以找找原始碼來整一波,fork一波websocketpp,其實整個東西大概就是一個websocket頭協議,
如何實現從 Redis 中訂閱消息轉發到 WebSocket 客戶端
模式 func pen subscribe ssa ole ade 連接 回調函數 PHP 的redis擴展是阻塞式 IO ,使用訂閱/發布模式時,會導致整個進程進入阻塞。因此必須使用Swoole\Redis異步客戶端來實現。 實例代碼 1 $server = new
websocket客戶端的實現
aep pvs shc fop aca boa drl exc apc 杭電1032 熱烈慶祝本人受關註人數即將突破11000大關!散分!! 看幾遍了 老是1error, 求大神幫忙!!! initializer_list不是std成員,求大神解惑,百度了好久一直沒解決 7
node.js中ws模塊創建服務端和客戶端,網頁WebSocket客戶端
socket 如果 創建服務 function ket socket客戶端 console serve 數據 1.node.js中ws模塊創建服務端 // 加載node上websocket模塊 ws; var ws = require("ws"); // 啟
使用zabbix3.0.4的ICMP Ping模版實現對客戶端網絡狀態的監控
host -1 ping 修改 cat onf 設置報警 amp 網絡狀態 一、登陸Zabbix服務器做以下操作: 1.fping安裝 wget http://www.fping.org/dist/fping-3.16.tar.gz tar zxvf fping-3.16.
Ubuntu16.04下安裝elasticsearch+kibana實現php客戶端的中文分詞
lba 實例 exc common adding creat 啟動服務 uid dbms 1.下載安裝elasticsearch和kibana wget https://artifacts.elastic.co/downloads/elasticsearch/elasti
C# 實現FTP客戶端
枚舉 username rect 進行 sco fine pac out puts 本文是利用C# 實現FTP客戶端的小例子,主要實現上傳,下載,刪除等功能,以供學習分享使用。 思路: 通過讀取FTP站點的目錄信息,列出對應的文件及文件夾。 雙擊目錄,則顯示子目錄,如果是
unity_小功能實現(客戶端相互通信功能)
直接 endpoint 客戶端和服務器端 network hat sockets odi family void 服務器端:在VS中新建項目,用於服務器的搭建 using System;using System.Collections.Generic; using
go語言實現 tcp客戶端/服務端
tcpl sem close byte cpc cep 實現 lee n) / server.go /package main import ("bufio""fmt""net""time")
go語言實現udp客戶端/服務端
rom client nic exit nil 客戶 ddr close udp / server.go /package main import ("fmt""net""os") func checkError
Python3+telnetlib實現telnet客戶端
encode tcl 之前 編碼 tps 連接失敗 lan cli get 一、程序要點說明 python實現telnet客戶端的六個關鍵問題及其答案是: 使用什麽庫實現telnet客戶端----telnetlib 怎麽連接主機----兩種方法,一種是在實例化時傳入ip地址
python3+paramiko實現ssh客戶端
bsp 實例化 ucc rom sys imp 執行命令 self 服務 一、程序說明 ssh客戶端實現主要有以下四個問題: 第一個問題是在python中ssh客戶端使用哪個包實現----我們這裏使用的是paramiko 第二個問題是怎麽連接服務器----連接服務器直接使用
基於Apache-Commons-Pool2實現Grpc客戶端連接池
i++ exc fin checked count() tcl 抽象 bdd process 概述 在項目運行過程中,有些操作對系統資源消耗較大,比如建立數據庫連接、建立Redis連接等操作,我們希望一次性創建多個連接對象,並在以後需要使用時能直接使用已創建好的連接,達到提
Python學習筆記1:簡單實現ssh客戶端和服務端
bsp dev bre 客戶端 break 基於 bin listen 客戶 實現基於python 3.6。 server端: 1 __author__ = "PyDev2018" 2 3 import socket,os 4 server = socket.s
Mybatis之攔截器--獲取執行SQL實現多客戶端數據同步
gin sign factor 方便 完成後 動態代理 exc batis 包安裝 最近的一個項目是將J2EE環境打包安裝在客戶端(使用 nwjs + NSIS 制作安裝包)運行, 所有的業務操作在客戶端完成, 數據存儲在客戶端數據庫中. 服務器端數據庫匯總各客戶端的數據進
linux網絡編程之用socket實現簡單客戶端和服務端的通信(基於UDP)
服務端 msg ets lin fgets err n) stderr tcp 單客戶端和服務端的通信(基於UDP) 代碼 服務端代碼socket3.c #include<sys/types.h> #include<sys/socket.h>
python socket 套接字編程 單進程服務器 實現多客戶端訪問
host port list 不能 ioerror 存儲 utf8 所有 tin 服務器: 1 import socket 2 #單進程服務器 實現多客戶端訪問 IO復用 3 #吧所有的客戶端套接字 放在一個列表裏面,一次又一次的便利過濾 4 #這就是apache
如何實現在客戶端或瀏覽器頁面中整合一個類似plsqldeveloper一樣的查詢功能?
轉載:https://ask.csdn.net/questions/703108 qq_16127313 https://gitee.com/00fly/effict-side/tree/master/dbtool-springboot 專案運維過程中,受到客戶機房管理
基於CAS的單點登入SSO[5]: 基於Springboot實現CAS客戶端的前後端分離
基於CAS的單點登入SSO[5]: 基於Springboot實現CAS客戶端的前後端分離 作者:家輝,日期:2017-08-24 CSDN部落格: http://blog.csdn.net/gobitan 摘要:現在大部分系統的開發都已經