页面导航期间 WebSocket 连接关闭错误

在页面导航时，WebSocket 连接会关闭并抛出错误“websocket：关闭已发送”。这是由于当用户离开页面时，浏览器会向服务器发送关闭消息。解决方法是： 1. 客户端在页面加载时建立 WebSocket 连接。 2. 服务器处理客户端的连接和断开连接，并在错误时清理资源。 3. 修改代码以处理一般错误，而不仅仅是关闭握手。 4. 读取器在返回时关闭连接并向写入器发出信号，告知其完成。 5. 当连接关闭时，关闭读写连接。

当我尝试将数据从服务器端发送到客户端（仪表板页面）时，我收到错误websocket：关闭已发送。当我导航到主页并返回仪表板页面时，会发生错误。最初使用仪表板页面一切正常

我的仪表板页面代码

let socket = new reconnectingwebsocket("ws://127.0.0.1:8004/wsendpoint");
        console.log("attempting connection...");

        socket.onopen = () => {
            console.log("successfully connected");
          
        };
        socket.onclose = event => {
            console.log("socket closed connection: ", event);
         
        };
        socket.onerror = error => {
            console.log("socket error: ", error);
         
        };
        socket.onmessage = function (event) {
            console.log("message received: " + event.data);
        }

我的服务器端代码（编写器和读取器

func wsendpoint(w http.responsewriter, r *http.request) {

    upgrader.checkorigin = func(r *http.request) bool { return true }
    // upgrade this connection to a websocket connection
    ws, err := upgrader.upgrade(w, r, nil)
    if err != nil {
        log.println("upgrade error %s", err)
    }

    defer ws.close()

    go writer(ws) 
    go reader(ws)
}

writer，当数据库有新数据进来时从通道获取数据

func writer(conn *websocket.conn) {

    for {
        singleset := <-singleorder // get data from channel
        jsonstring, err := json.marshal(singleset ) 
        err = conn.writemessage(1, []byte(jsonstring))
        if err != nil {
            log.println(err)
        }
    }

reader，从客户端读取数据

func reader(conn *websocket.Conn) {
    for {
        _, p, err := conn.ReadMessage() //what is message type?
        if err != nil {
            log.Println("there is errors%s", err)
            return
        }
    }
}

我还收到错误 websocket 在建立连接之前已关闭。 和 reconnecting-websocket.min.js:1 websocket 连接到 'ws://127.0.0.1:8004/ wsendpoint'失败：websocket 在建立连接之前关闭。

正如你所看到的，所有代码都非常简单，因为我刚刚开始学习 websocket 并遵循简单的教程。我尝试在网络上搜索，但 webworker 对我来说似乎有点复杂，并看到了 ping pong 方法，但我不确定如果我导航它是否仍然有效。我可以在主页上建立websocket，这样连接就不会关闭吗？因为我在客户端只有两个页面。

预先感谢您提供有关如何处理这些情况的指导！

正确答案

处理离开页面、页面关闭或错误的基本策略是：客户端在页面加载时创建 websocket 连接。服务器预计客户端连接的到来和离开，并在客户端连接错误时清理资源。

这就是为什么您会收到错误“websocket：关闭已发送”：当用户离开页面时，浏览器会向服务器发送 close message 作为 websocket closing handshake 的一部分。gorilla 包通过发送另一条消息来响应关闭消息关闭消息返回给客户端。从那时起，服务器无法在连接上发送消息。发送关闭消息后，连接从写入方法返回错误。

关闭消息为 returned as errors from the websocket read methods。要解决该问题，请修改代码以处理一般错误。无需专门处理结束握手。

这是更新后的代码。 wsendpoint 函数为读取器创建一个通道，以向写入器发出读取器已完成的信号。 defer ws.close() 语句已被删除，因为读取器和写入器 goroutine 将负责关闭连接。

func wsendpoint(w http.responsewriter, r *http.request) {

    upgrader.checkorigin = func(r *http.request) bool { return true }
    // upgrade this connection to a websocket connection
    ws, err := upgrader.upgrade(w, r, nil)
    if err != nil {
        log.println("upgrade error %s", err)
    }

    done := make(chan struct{})     
    go writer(ws, done) 
    go reader(ws, done)
}

读取器在返回时关闭连接。它还会关闭 done 通道，以向写入器发出信号，告知读取器已完成。

func reader(conn *websocket.conn, done chan struct{}) {
    defer conn.close()
    defer close(done)
    for {
        _, p, err := conn.readmessage() //what is message type?
        if err != nil {
            log.println("there is errors%s", err)
            return
        }
    }
}

作者还会在返回时关闭连接。当连接关闭时，连接上的 read 立即返回一个错误，导致 read goroutine 完成。作者在 done 通道上等待。当阅读器关闭通道时，通道上的接收会产生零值。作者在写入错误时返回，而不是像问题中那样永远循环。

func writer(conn *websocket.Conn, done chan struct{}) {
    defer conn.Close()
    for {
        select {
        case <-done:
            // the reader is done, so return
            return
        case singleset := <-singleorder: // get data from channel
            jsonString, err := json.Marshal(singleset ) 
            err = conn.WriteMessage(1, []byte(jsonString))
            if err != nil {
                log.Println(err)
                return
            }
        }
    }
}

应用程序应该预期连接会因多种原因而关闭，包括用户离开页面。

发送到通道 singleorder 的代码可能需要知道连接已关闭，但我们在这里看不到该代码。我将把它留给你来弄清楚如何处理这个问题。

文中关于的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《页面导航期间 WebSocket 连接关闭错误》文章吧，也可关注golang学习网公众号了解相关技术文章。