資料實時更新 webSocket 輪詢

2022-08-23 07:03:15 字數 4632 閱讀 5062

單工:單向通訊。即只能伺服器->客戶端。例如: udp協議

半雙工:既可以伺服器->客戶端,也可以客戶端->伺服器。但是同一時間,只能是乙個方向。例如: http協議。

全雙工:雙向通訊。同一時間內既可以客戶端->伺服器;也可以伺服器->客戶端。例如:websocket協議

伺服器實時的將更新的資料傳送到客戶端。

應用:

1)即時聊天工具

2)**等實時資訊展示工具

有以下實現方式

1. 輪詢

輪詢即週期性(setinterval)的發起請求並返回響應(傳送請求->響應資料->關閉連線->傳送請求)。

如果響應的所需時間過長,它的再次請求也不會等待上一次的響應完成。

缺點:

1)請求過於頻繁,請求數過多,每次請求都要攜帶請求頭,浪費流量,消耗cpu的利用率

2)當客戶端過多時,會導致併發數量過高

3)後台資料不頻繁變化時, 頻繁發出的很多請求是無效請求

示例:客戶端:

伺服器:

const express = require('express');

(req, res) );

2. 長輪詢(long polling)

優點:

如果響應時間大於輪詢的週期頻率,會減少請求次數,實現節約流量(請求header/請求次數),提高cpu利用率的作用。

示例:客戶端:

//自執行函式

(function

longpolling()

}xhr.send();

})();

script

>

body

>

伺服器:

const express = require('express');

(req, res) , 3000);

});3. iframe流

本質上是使用「長連線」,即請求傳送後,定時返回響應,並不呼叫(res.end)斷開連線。

在頁面中巢狀乙個隱藏的iframe,其src設定為乙個長鏈結請求,伺服器源源不斷的向客戶端推送資料。

示例:客戶端

<

body

>

<

div

id="root"

>

div>

<

iframe

src='/clock'

style

="display: none"

>

iframe

>

body

>

伺服器

const express = require('express');

(req, res) , 1000)

});4. websocket

websocket是h5提供的一種新的通訊方式,可以使客戶端和伺服器保持持久連線。

websocket使用ws協議,和http協議是同級協議,都是應用層協議。而tcp協議是傳輸層協議。

websocket基於tcp協議,可以基於tcp實現websocket伺服器。並且復用http協議的握手通道。

優點:

1)全雙工通訊

2)請求頭體積小

缺點:

1)不相容

2)客戶端和瀏覽器端用法不同

示例:客戶端

<

body

>

使用者:<

input

id="username"

/>

密碼:<

input

id="password"

type

="password"

/>

<

br/>

<

button

onclick

="login()"

>登入

button

>

<

script

>

const ws

=new

websocket(

'ws://localhost:8888');

ws.onopen

=function

() ;

ws.onmessage

=function

(event) ;

//登入函式

function

login() ));

}script

>

body

>

伺服器

//

為靜態資源檔案起服務;http協議

const express = require('express');

(req, res) );

//ws協議;websocket通訊的伺服器

const websocketserver = require('ws').server;

const = require('jsonwebtoken');//

使用jwt

const server = new websocketserver();

server.on('connection', function

(socket) =json.parse(message);

if(type === 'login') , 'lyra');//

預設hmac sha256

socket.send(json.stringify());}})

});

5. socket.io

socket.io是乙個websocket庫,它包含瀏覽器端的js和伺服器端的nodejs, 目的是構建在不同瀏覽器和裝置上的、通用的網路實時應用。

優點:

1. 易用性:它封裝了客戶端和服務端

2. 跨平台

3. 自適應: 可以根據瀏覽器自動從websocket/長輪詢/iframe流中選擇

基礎用法:

//

1. 全域性廣播

io.emit('message', content);

//2. 向除自己之外的所有人廣播

socket.broadcast.emit('message', content);

//3.只廣播到特定人(socket對應的客戶端使用者)

socket.emit('message', content);

//或者

socket.send(content);

Ceisum實時獲取後台資料 實時更新實體位置資訊

用定時器模擬實時獲取後台資料 當取到資料後實體同時移動到目標位置 這種方式不再與cesium時間關聯 實現效果 每秒新增乙個座標 每秒實體運動到相應正確位置 var viewer new cesium.viewer cesiumcontainer var positions var poly und...

資料實時備份

隨著企業對資訊系統的依賴性越來越高,資料庫作為資訊系統的核心擔當著重要的角色。尤其在一些對資料可靠性要求很高的行業如銀行 電信等,如果發生意外停機或資料丟失其損失會十分慘重。資料庫的備份是乙個長期的過程,而恢復只在發生事故後進行,恢復可以看作是備份的逆過程,恢復的程度的好壞很大程度上依賴於備份的情況...

Javascript中資料實時推送

資料變化後前端需要更新,有幾種方式 參考 1.利用setinterval函式,每隔n秒去非同步拉取資料。對資料實時性要求不高時可用。2.ajax輪詢方式推送資料。缺點是服務端需要在死迴圈中反覆查詢資料庫。還沒有試過這種方式 3.利用websocket推送資料,這是html5提供的方法,所以只能支援h...