Cara Acara Dihantar Pelayan (SSE) Berfungsi

SSE (Peristiwa Dihantar Pelayan) tidak digunakan secara meluas dalam dunia pembangunan web, artikel ini akan menyelam lebih mendalam tentang apa itu SSE, cara ia berfungsi dan cara ia boleh mendapat manfaat permohonan anda.

Apakah SSE?

SSE ialah cara yang mudah dan cekap untuk menghantar kemas kini masa nyata daripada pelayan kepada pelanggan melalui sambungan HTTP. Ia adalah sebahagian daripada spesifikasi HTML5 dan disokong oleh semua pelayar web moden. SSE adalah berdasarkan aliran data satu arah, di mana pelayan menghantar mesej kepada klien, tetapi klien tidak boleh menghantar mesej kembali ke pelayan.

SSE menggunakan format berasaskan teks yang dikenali sebagai "Peristiwa Dihantar Pelayan" untuk menghantar data kepada pelanggan. Data dihantar sebagai satu siri acara, setiap satunya mengandungi mesej dan jenis acara pilihan. Jenis acara digunakan untuk membezakan antara jenis mesej yang berbeza dan membolehkan pelanggan mengendalikannya secara berbeza.

Bagaimanakah SSE berfungsi?

Protokol SSE berfungsi dengan mewujudkan sambungan HTTP yang berterusan antara pelayan dan klien. Sambungan ini terus dibuka selagi pelanggan mahu menerima kemas kini daripada pelayan. Apabila pelayan mempunyai data baharu untuk dihantar, ia menghantar respons HTTP dengan jenis MIME khas “text/event-stream”.

Respons mengandungi satu siri peristiwa, setiap satu daripadanya dipisahkan oleh aksara baris baharu (“n”). Setiap acara mempunyai format berikut:

event: [event type]\n
data: [message]\n\n

Medan "acara" adalah pilihan dan digunakan untuk memberikan nama untuk acara tersebut. Medan "data" mengandungi mesej sebenar yang dihantar. Dua aksara baris baharu pada penghujung setiap acara digunakan untuk menandakan berakhirnya acara.

Berikut ialah contoh respons SSE mudah:

HTTP/1.1 200 OK
Content-Type: text/event-stream

event: message
data: Hello, world!

event: message
data: This is a test message.

event: customEvent
data: {"foo": "bar", "baz": 123}

Dalam contoh ini, kami menghantar tiga acara kepada pelanggan. Dua acara pertama mempunyai jenis acara "mesej" dan mengandungi mesej teks mudah. Acara ketiga mempunyai jenis acara "customEvent" dan mengandungi objek JSON sebagai mesejnya.

Apabila pelanggan menerima respons SSE, ia menggunakan data untuk mengemas kini antara muka penggunanya. Ini boleh dilakukan menggunakan JavaScript untuk memanipulasi DOM, contohnya.

Melaksanakan SSE

Melaksanakan SSE dalam aplikasi anda agak mudah. Berikut ialah contoh cara melaksanakan SSE menggunakan Node.js dan rangka kerja Express:

const express = require('express');
const app = express();

// Set up SSE endpoint
app.get('/events', (req, res) => {
  // Set headers
  res.setHeader('Content-Type', 'text/event-stream');
  res.setHeader('Cache-Control', 'no-cache');
  res.setHeader('Connection', 'keep-alive');
  // Send initial event
  res.write('data: Connected\n\n');
  // Set interval to send periodic events
  const intervalId = setInterval(() => {
    res.write('data: Hello, world!\n\n');
  }, 1000);
  // Clean up on connection close
  req.on('close', () => {
    clearInterval(intervalId);
  });
});

// Start server
app.listen(3000, () => {
  console.log('Server started on port 3000');
});

Dalam contoh ini, kami menyediakan titik akhir SSE di "/events". Kami menetapkan pengepala yang diperlukan untuk SSE dan menghantar acara awal kepada pelanggan untuk mengesahkan bahawa sambungan telah diwujudkan.

Kami kemudian menyediakan selang waktu untuk menghantar acara berkala kepada pelanggan setiap saat. Akhir sekali, kami sedang membersihkan selang apabila sambungan ditutup oleh pelanggan.

Di pihak pelanggan, kami boleh menggunakan kod JavaScript berikut untuk mendengar acara SSE:

const source = new EventSource('/events');

source.addEventListener('message', (event) => {
  console.log(event.data);
});
source.addEventListener('error', (event) => {
  console.error('Error:', event);
});

Dalam contoh ini, kami sedang mencipta objek EventSource baharu dan menghantar URL titik akhir SSE kami. Kami kemudian mendengar acara "mesej" dan log data ke konsol. Kami juga sedang mendengar acara "ralat" sekiranya terdapat sebarang isu sambungan.

Perhatikan bahawa laluan EventSource di bahagian hadapan hanya boleh digunakan oleh permintaan GET, jika anda ingin menggunakan POST dan kaedah HTTP lain, anda perlu menghuraikan data respons sendiri.

Jika anda mahukan pelaksanaan Node.js asli, inilah satu

Gunakan kes untuk SSE

SSE boleh digunakan dalam pelbagai aplikasi yang memerlukan kemas kini masa nyata. Berikut ialah beberapa contoh:

• Platform media sosial: SSE boleh digunakan untuk menyediakan kemas kini masa nyata untuk platform media sosial, seperti pemberitahuan mesej baharu, ulasan atau suka.

• Aplikasi kewangan: SSE boleh digunakan untuk menyediakan kemas kini masa nyata untuk aplikasi kewangan, seperti harga saham, kadar pertukaran mata wang atau berita.

• Perjudian dalam talian: SSE boleh digunakan untuk menyediakan kemas kini masa nyata untuk aplikasi permainan dalam talian, seperti pemberitahuan acara permainan, markah atau kedudukan.

Faedah menggunakan SSE

Terdapat beberapa faedah menggunakan SSE berbanding kaedah komunikasi masa nyata yang lain seperti pengundian atau WebSockets:

Kecekapan

SSE menggunakan sambungan HTTP yang berterusan, yang bermaksud bahawa overhed untuk mewujudkan dan mengekalkan sambungan adalah jauh lebih rendah daripada kaedah lain. Ini menjadikan SSE lebih cekap dan kurang intensif sumber, yang amat penting apabila berurusan dengan sejumlah besar pelanggan.

Kesederhanaan

SSE ialah protokol ringkas yang mudah difahami dan dilaksanakan. Ia tidak memerlukan sebarang perpustakaan atau rangka kerja khas dan boleh dilaksanakan menggunakan teknologi web standard seperti JavaScript dan HTTP.

Kebolehpercayaan

SSE ialah protokol yang boleh dipercayai yang menyediakan penyambungan semula automatik sekiranya berlaku gangguan rangkaian. Ini memastikan pelanggan akan terus menerima kemas kini walaupun sambungan terputus buat sementara waktu.

Kesimpulan

Peristiwa Dihantar Pelayan (SSE) ialah cara yang mudah dan cekap untuk menghantar kemas kini masa nyata daripada pelayan kepada klien melalui sambungan HTTP. Ia adalah sebahagian daripada spesifikasi HTML5 dan disokong oleh semua pelayar web moden. SSE menggunakan aliran data satu arah, di mana pelayan menghantar mesej kepada klien, tetapi klien tidak boleh menghantar mesej kembali ke pelayan. Ini menjimatkan anda daripada terus mengundi pelayan untuk acara, yang bukan sahaja meningkatkan prestasi tetapi juga mengurangkan kerumitan.

Jika anda mendapati ini membantu, sila pertimbangkan melanggan surat berita saya untuk lebih banyak artikel dan alatan berguna tentang pembangunan web. Terima kasih kerana membaca!

Atas ialah kandungan terperinci Cara Acara Dihantar Pelayan (SSE) Berfungsi. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!