WebSocket dan JavaScript: teknologi utama untuk melaksanakan sistem pemantauan masa nyata

Pengenalan:
Dengan perkembangan pesat teknologi Internet, sistem pemantauan masa nyata telah digunakan secara meluas dalam pelbagai bidang. Salah satu teknologi utama untuk mencapai pemantauan masa nyata ialah gabungan WebSocket dan JavaScript. Artikel ini akan memperkenalkan aplikasi WebSocket dan JavaScript dalam sistem pemantauan masa nyata, memberikan contoh kod dan menerangkan prinsip pelaksanaannya secara terperinci.

1 Pengenalan kepada teknologi WebSocket
WebSocket ialah protokol untuk komunikasi dupleks penuh pada satu sambungan TCP. Berbanding dengan protokol HTTP tradisional, WebSocket mempunyai kelebihan prestasi masa nyata yang baik, kependaman rendah dan penggunaan lebar jalur yang rendah, dan amat sesuai untuk sistem pemantauan masa nyata.

2. JavaScript untuk melaksanakan sambungan WebSocket
Sangat mudah untuk melaksanakan sambungan WebSocket menggunakan JavaScript. Pertama, anda perlu mencipta objek WebSocket dan nyatakan URL sambungan:

var socket = new WebSocket("ws://localhost:8080/monitor");

Antaranya, ws:// bermaksud menggunakan protokol WebSocket, localhost:8080 ialah alamat dan port pelayan WebSocket, dan /monitor adalah khusus Titik akhir perkhidmatan WebSocket.

Seterusnya, anda perlu menentukan beberapa fungsi pengendalian acara WebSocket untuk berkomunikasi dengan pelayan. Acara biasa termasuk onopen, onmessage, onclose dan onerror:

socket.onopen = function(){
  console.log("WebSocket连接已经建立");
};

socket.onmessage = function(event){
  console.log("收到消息：" + event.data);
};

socket.onclose = function(){
  console.log("WebSocket连接已经关闭");
};

socket.onerror = function(error){
  console.log("WebSocket连接发生错误：" + error);
};

Melalui fungsi pemprosesan acara ini, interaksi data masa nyata dengan pelayan boleh dicapai.

3. Contoh kod bahagian pelayan
Bahagian pelayan WebSocket dilaksanakan menggunakan perpustakaan Node.js dan WebSocket. Berikut ialah contoh kod sebelah pelayan WebSocket yang mudah:

const WebSocket = require('ws');

const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', function connection(ws) {
  console.log('WebSocket连接已建立');

  // 监听客户端发来的消息
  ws.on('message', function incoming(message) {
    console.log('收到消息：', message);
  });

  // 发送消息给客户端
  ws.send('欢迎连接WebSocket服务器');
});

Kod di atas mencipta pelayan WebSocket, mengeluarkan log apabila klien mewujudkan sambungan dengan pelayan, menerima dan mengeluarkan mesej daripada klien dan menghantar ucapan selamat datang kepada klien maklumat.

4. Aplikasi dalam sistem pemantauan masa nyata
Dalam sistem pemantauan masa nyata, gabungan WebSocket dan JavaScript boleh menolak dan menerima data masa nyata. Sebagai contoh, sistem pemantauan suhu boleh menolak data suhu yang dikumpul oleh sensor ke antara muka pemantauan dalam masa nyata melalui WebSocket Pada masa yang sama, antara muka pemantauan boleh memantau perubahan data sensor melalui WebSocket. Berikut ialah contoh kod antara muka pemantauan yang mudah:

  
    
  

  
    
实时温度监控系统
    


    <script>
      var socket = new WebSocket(&quot;ws://localhost:8080/monitor&quot;);

      socket.onmessage = function(event){
        var temperature = document.getElementById("temperature");
        temperature.innerHTML = "当前温度为：" + event.data;
      };
    </script>
  

Kod di atas mencipta antara muka pemantauan yang mudah, yang memantau data suhu yang dihantar daripada pelayan melalui WebSocket dan memaparkannya pada antara muka dalam masa nyata.

Kesimpulan:
Penggunaan gabungan WebSocket dan JavaScript adalah salah satu teknologi utama untuk melaksanakan sistem pemantauan masa nyata. Melalui WebSocket dan JavaScript, data masa nyata boleh ditolak dan diterima dalam sistem pemantauan masa nyata. Contoh kod yang diberikan di atas ialah sistem pemantauan suhu masa nyata yang mudah untuk rujukan pembaca. Dalam aplikasi praktikal, pembangunan dan pengoptimuman selanjutnya boleh dijalankan mengikut keperluan khusus.

Atas ialah kandungan terperinci WebSocket dan JavaScript: teknologi utama untuk melaksanakan sistem pemantauan masa nyata. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!