如何使用服务器发送事件（SSE）捕获丢失的互联网连接并防止浏览器显示其错误页面？

Question

我正在与 SSE 合作，并意识到如果互联网连接丢失，浏览器总是会转到错误页面。在失去连接的那一刻，它显示“无法访问此站点”，然后过了一会儿：“没有互联网 - ERR_INTERNET_DISCONNECTED”。

我确信原因是 SSE 连接，因为我的服务器上没有 SSE 的所有其他网站都会被加载，并且即使互联网连接丢失也会继续显示。

使用 Javascript，我尝试通过以下方式捕获丢失的连接：

sse_source.onerror = function(e) 
{
    e.preventDefault(); // prevent default, not working

    if (sse_source.readyState == EventSource.CLOSED)
    {
        // close SSE source
        sse_source.close();
    }

    // alert shows up and interrupts, but after clicking OK 
    // the browser error page is displayed
    alert('Connection to Server lost. No Live Updates.');
}

但它什么也没做。

我也尝试过：

window.addEventListener('offline', updateOnlineStatus);

function updateOnlineStatus(e)
{
    e.preventDefault(); // prevent default, not working

    sse_source.close();

    alert('Connection to Server lost. No Live Updates.');
}

此处不显示警报。浏览器总是会转到错误页面。

还有其他Javascript可以保持显示网站吗？

更新：

我可以在控制台中看到，当连接丢失时，

sse_source.onerror

仍然被完全处理。但无法阻止错误页面从那里出现。

在

sse_source.onerror

之后，处理

window.addEventListener('offline', updateOnlineStatus)

。也无法从这里停止错误页面。

啊，当我删除

sse_source.onerror

时，它实际上显示了带有

sse_source.readyState == EventSource.CLOSED

的alert()。就绪状态是

0

。

Answer 1

我最终简单地解决了它：

sse_source.onerror = function(e)
{
    alert('Connection lost. No Live Updates.');

    e.preventDefault();

    // close SSE source
    sse_source.close();
    
    return;
}