websocket: Client not using websocket protocol: 'Upgrade' token not found in 'Connection' header

王林
Release: 2024-02-09 14:24:10
forward
1220 people have browsed it

websocket:客户端未使用 websocket 协议:“连接”标头中未找到“升级”令牌

When making a WebSocket connection, sometimes the error "Client is not using the WebSocket protocol: 'Upgrade' token not found in 'Connection' header" error will appear. This error is usually caused by the client not using the WebSocket protocol correctly. WebSocket is a protocol that enables two-way communication between a client and a server, using a special handshake process to establish a connection. During the handshake, the client needs to properly send the "Upgrade" header to indicate the use of the WebSocket protocol. If the client does not send this header correctly, the server will return the above error. PHP editor Baicao will introduce in detail how to solve this problem in this article so that your WebSocket connection can proceed smoothly.

Question content

I'm trying to establish a websocket connection to a server written in go and javascript frontend. I have the following files in a directory:

main.go index.html

**This is my go code in main.go: **

package main


import (
    "fmt"
    "log"
    "net/http"

    "github.com/gorilla/websocket"
)

var upgrader = websocket.upgrader{
    readbuffersize:  1024,
    writebuffersize: 1024,
}

func homepage(w http.responsewriter, r *http.request) {
    http.servefile(w, r, "./index.html")
    conn, err := upgrader.upgrade(w, r, nil)
    if err != nil {
        log.println("error in handler:", err)
        return
    }
    log.println("client connected.")

    for {
        messagetype, p, err := conn.readmessage()
        if err != nil {
            log.println("fehler in readmessage: ", err)
            return
        }

        log.println(string(p))

        //echo message to client
        if err := conn.writemessage(messagetype, p); err != nil {
            log.println(err)
            return
        }
    }
}

func setuproutes() {
    http.handlefunc("/ws", homepage)
}

func main() {
    fmt.println("server gestartet")
    setuproutes()
    log.fatal(http.listenandserve(":9100", nil))

}
Copy after login

This is the html and javascript in index.html:

<!doctype html>
<html lang="de">
<head>
    <meta charset="utf-8">
    <title>some unimportant html </title>
</head>
<body>
    
    <script>


        let socket = new websocket("ws://localhost:9100/ws");
        console.log("websocket started.");

        socket.onopen = () => {
            console.log("client started.");
        }

        socket.onclose = (event) => {
            console.log("socket closed: ", event);
        }

        socket.onerror = (error) => {
            console.log("socket error: ", error);
        }

        socket.onmessage = (msg) => {
            console.log(msg);
        }
    </script>
</body>
</html>
Copy after login

However, when I run the thing using go run main.go I get the following error:

2022/11/20 16:38:33 http: superfluous response.writeheader call from github.com/gorilla/websocket.(*upgrader).returnerror (server.go:83)
2022/11/20 16:38:33 error in handler: websocket: the client is not using the websocket protocol: 'upgrade' token not found in 'connection' header
2022/11/20 16:38:33 error in handler: write tcp [::1]:9100->[::1]:63712: wsasend: eine bestehende verbindung wurde softwaregesteuert durch den hostcomputer abgebrochen.
2022/11/20 16:39:06 error in handler: write tcp [::1]:9100->[::1]:63733: wsasend: eine bestehende verbindung wurde softwaregesteuert durch den hostcomputer abgebrochen.
exit status 0xc000013a
Copy after login

The German meaning is "The existing connection is terminated under the control of the host software"

I'm missing something, and my understanding isn't deep enough to figure out what the problem is. Any help is greatly appreciated!

I thought maybe my js websocket was missing an upgrade, but in chrome I can see the following request header for the request url ws://localhost:9100/ws which says "upgrade:websocket"

Accept-Encoding: gzip, deflate, br
Accept-Language: de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7
Cache-Control: no-cache
Connection: Upgrade
Host: localhost:9100
Origin: http://localhost:9100
Pragma: no-cache
Sec-WebSocket-Extensions: permessage-deflate; client_max_window_bits
Sec-WebSocket-Key: h3DWLuXsI9/GkTo+sIjyzw==
Sec-WebSocket-Version: 13
Upgrade: websocket
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36
Copy after login

Solution

I was able to fix it thanks to cerise limón's helpful comment. The problem is that I need one endpoint for indexing files and another for websockets. So I changed the relevant part to:

func websocketHandler(w http.ResponseWriter, r *http.Request) {
    conn, err := upgrader.Upgrade(w, r, nil) //conn is a websocket connection (aus http wird websocket protokoll)
    if err != nil {
        log.Println("Error in handler:", err)
        return
    }
    log.Println("Client connected.")

    
    for {
        messageType, p, err := conn.ReadMessage()
        if err != nil {
            log.Println("Fehler in ReadMessage: ", err)
            return
        }

        log.Println(string(p))

        //echo message to client
        if err := conn.WriteMessage(messageType, p); err != nil {
            log.Println(err)
            return
        }
    }
}

func homePage(w http.ResponseWriter, r *http.Request) {
    http.ServeFile(w, r, "./index.html")
}

func setupRoutes() {
    http.HandleFunc("/", homePage)
    http.HandleFunc("/ws", websocketHandler)

}
Copy after login

The above is the detailed content of websocket: Client not using websocket protocol: 'Upgrade' token not found in 'Connection' header. For more information, please follow other related articles on the PHP Chinese website!

source:stackoverflow.com
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!