前言

我們平時(shí)的工作中可能需要和服務(wù)端建立鏈接，從而來接受服務(wù)端推送的數(shù)據(jù)，常用的就是eventSource，我們平時(shí)常用的就是通過get的方式創(chuàng)建一個(gè)eventSource，但是我們?nèi)绾瓮ㄟ^post的方式創(chuàng)建呢？首先我們介紹一下eventSource，還有他和websocket的區(qū)別：

1.eventSource的介紹

1）eventSource 是一個(gè) Web API，它允許網(wǎng)頁通過 HTTP 長連接（通常稱為 Server-Sent Events (SSE)）從 Web 服務(wù)器接收自動(dòng)更新。它使網(wǎng)頁可以接收實(shí)時(shí)更新，而無需刷新頁面或向服務(wù)器發(fā)送重復(fù)請(qǐng)求。

2）使用 eventSource，網(wǎng)頁可以訂閱從服務(wù)器發(fā)送的事件流。這些事件可以是任何格式，例如純文本、JSON 或 XML，并且可以包含服務(wù)器想要發(fā)送的任何數(shù)據(jù)。一旦建立連接，服務(wù)器可以隨時(shí)向客戶端發(fā)送事件，客戶端可以根據(jù)需要處理它們，例如更新 UI 或觸發(fā)其他操作。

3）eventSource API 使用簡單，并且受到大多數(shù)現(xiàn)代 Web 瀏覽器的支持。它通常用于需要實(shí)時(shí)更新的 Web 應(yīng)用程序，例如聊天室、社交媒體提要或股票市場行情。

2.eventSource和websocket的區(qū)別：

1）協(xié)議不同：WebSocket 使用的是一種雙向通信協(xié)議，而 eventSource 使用的是一種單向通信協(xié)議。WebSocket 協(xié)議可以在客戶端和服務(wù)器之間建立一個(gè)長連接，雙方可以同時(shí)發(fā)送和接收消息，而 eventSource 只能由服務(wù)器向客戶端發(fā)送消息。

2）數(shù)據(jù)格式不同：WebSocket 可以發(fā)送任何格式的數(shù)據(jù)，例如文本、二進(jìn)制數(shù)據(jù)或 JSON，而 eventSource 只能發(fā)送文本格式的數(shù)據(jù)。

3）支持程度不同：WebSocket 是一種相對(duì)較新的技術(shù)，在一些舊的瀏覽器或網(wǎng)絡(luò)環(huán)境下可能不被支持，而 eventSource 已經(jīng)被廣泛支持，可以在大多數(shù)現(xiàn)代瀏覽器中使用。

4）應(yīng)用場景不同：WebSocket 更適合那些需要實(shí)時(shí)雙向通信的應(yīng)用，例如在線游戲或視頻會(huì)議，而 eventSource 更適合那些需要從服務(wù)器獲取實(shí)時(shí)信息的應(yīng)用，例如股票行情或新聞推送。

3.如何用post的方式請(qǐng)求eventSource

常用的就是通過fetchEventSource這個(gè)庫來實(shí)現(xiàn)，實(shí)現(xiàn)方式如下：

npm i --save @rangermauve/fetch-event-source
 
import { fetchEventSource } from '@microsoft/fetch-event-source';
 
       let eventSource = fetchEventSource(Url, {
        method: 'POST',
        headers: {
          "Content-Type": 'application/json',
        },
        body: JSON.stringify(data),
        onmessage(event) {
          console.info(event.data);
        },
        onerror() {
          
        }
      })

總結(jié)

到此這篇關(guān)于前端如何用post的方式進(jìn)行eventSource請(qǐng)求的文章就介紹到這了,更多相關(guān)post方式eventSource請(qǐng)求內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論