Question

我的理解是HTTP流式传输涉及客户端发送HTTP请求，然后响应随时间发送的请求，允许服务器基本上推送到客户端。在我所看到的情况下，SSE似乎按照相同的原则运作，但更为正式化。那是否接近正确的理解？

我看到了这些问题，但他们没有直接回答我的问题。

HTTP: what are the relations between pipelining, keep-alive and Server Sent Events? What are Long-Polling, Websockets, Server-Sent Events (SSE) and Comet?

我也看了这个https://www.html5rocks.com/en/tutorials/eventsource/basics/#disqus_thread 设置SSE的教程似乎就像我想象的那样设置了HTTP流。

Answer 1

SSE实际上是HTTP流媒体的一种形式。它只是一个HTTP响应，MIME类型为＆＃34; text / event-stream＆＃34;并且它发送以双换行符结束的纯文本消息。

SSE不是以前无法做到的事情，但网站必须使用WebSocket连接，AJAX长轮询，彗星，定期轮询等，现在使用SSE，API已经标准化，实现非常简单。参见：

https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events

需要记住的一点是，包括Edge和IE Mobile在内的IE不支持SSE：

http://caniuse.com/#feat=eventsource

因此，除非您知道他们使用的浏览器，否则您无法真正将其用于更广泛的受众群体。

Answer 2

恕我直言，HTTP2服务器发送的事件比HTTP流具有更丰富的功能。

在单向数据流（服务器->客户端）中，可以根据后端事件对客户端进行编排，服务器发送的事件可能是一个不错的选择。

例如：

# ---------- client side -----------

const eventSource = new EventSource("//your-api/workflow/state");

eventSource.addEventListener("queued", function(event) {
    ...
}
eventSource.addEventListener("started", function(event) {
    ...
}
eventSource.addEventListener("failed", function(event) {
    ...
}
eventSource.addEventListener("success", function(event) {
    ...
}

服务器发送事件的限制：

SSE事件占用浏览器打开的连接。
对最大打开连接数的限制不是在浏览器选项卡级别上，而是在整个浏览器级别上
我撰写本文时，Chrome和Firefox的得分为6（太低）。此限制是针对每个浏览器+域的，因此这意味着您可以跨所有标签打开到www.example1.com的6个SSE连接，并打开到www.example2.com的另外6个SSE连接。

HTTP流

在许多使用案例中，HTTP流式传输可能很有用。如果我们仅对来自Server的消息流感兴趣，这可能会很方便。

示例场景：

假设我们喜欢将日志文件内容流式传输到客户端。要么是一个巨大的文件，要么文件内容不断更新，我们希望将其发送给客户端（例如日志尾）。在这种情况下，HTTP流（Transfer-Encoding: chunked）可以满足我们的需求。

# ---------- client side -----------
const streamRequest = (url) => {
    fetch(url).then(function (response) {
        let reader = response.body.getReader();
        let decoder = new TextDecoder();
        return readData();
        function readData() {
            return reader.read().then(function ({value, done}) {
                console.log(value)
                if (value) {
                    let newData = decoder.decode(value, {stream: !done});
                    console.log(newData);    
                }
                if (done) {
                    console.log('end of stream');
                    return;
                }
                return readData();
            });
        }
    });
}

流响应的限制：

如果发生流响应（分块）-HTTP / 2不支持HTTP 1.1的分块传输编码机制，因为它提供了自己的，更有效的数据流传输机制。

HTTP流和服务器发送事件有什么区别？

2 个答案: