WebSocket 握手期间出错:意外响应代码:302

IT技术 java json reactjs websocket jetty
2021-05-17 05:58:52

将基于 REACT 的 WebSocket 客户端连接到基于 Java Jetty 的 Web Socket 服务器时,出现以下错误 -

WebSocket connection to 'ws://localhost:2319/ws' failed: Error during WebSocket handshake: Unexpected response code: 302

通过 Chrome 的 Smart Web Socket 客户端连接时不存在此错误。

我正在尝试基于 REACT 开发 Web Socket Client。客户端代码是 -

var connection = new WebSocket('ws://localhost:2319/ws');
     connection.onopen = function () {
     // connection is opened and ready to use
    };

WebSocket Server 一直基于 Jetty。服务器代码是 -

server = new Server();
    ServerConnector connector = new ServerConnector(server);
    connector.setPort(SSConstants.WWBSOCKET_PORT);
    server.addConnector(connector);

    // Setup the basic application "context" for this application at "/"
    // This is also known as the handler tree (in jetty speak)
    ServletContextHandler context = new ServletContextHandler(ServletContextHandler.SESSIONS);
    context.setContextPath("/ws"); // Set to "/ws" for future integration with the main jetty server.
    server.setHandler(context);

    try {
        // Initialize javax.websocket layer
        ServerContainer wsContainer = WebSocketServerContainerInitializer.configureContext(context);

        // Add WebSocket endpoint to javax.websocket layer
        wsContainer.addEndpoint(WebsocketListener.class);
        server.start();           
    }
    catch (Throwable t) {
        ssLogger.logInfo("Websocket Server start exp : ");
        t.printStackTrace(System.err);
    }

输出 -

WebSocket connection to 'ws://localhost:2319/ws' failed: Error during WebSocket handshake: Unexpected response code: 302

Request URL:ws://localhost:2319/ws
Request Method:GET
Status Code:302 Found

Response Headers
view source
Content-Length:0
Date:Fri, 11 Aug 2017 18:51:42 GMT
Location:http://localhost:2319/ws/
Server:Jetty(9.3.8.v20160314)

Request Headers
view source
Accept-Encoding:gzip, deflate, br
Accept-Language:en-US,en;q=0.8
Cache-Control:no-cache
Connection:Upgrade
Host:localhost:2319
Origin:https://localhost:1338
Pragma:no-cache
Sec-WebSocket-Extensions:permessage-deflate; client_max_window_bits
Sec-WebSocket-Key:2OZooIjOX7G6kgNpPOz9Fw==
Sec-WebSocket-Version:13
Upgrade:websocket
User-Agent:Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36
Name
2个回答

ws://localhost:2319/ws不是有效的端点 URL/URI,它想重定向到您声明contextPath正确/ws

这就是 302 重定向告诉你的......

Location: http://localhost:2319/ws/

比方说,你WebsocketListener是为宣布@ServerEndpoint("/ws"),我们使用您ServletContextcontextPath"/ws",这将意味着你的URL / URI访问的WebSocket端点...

ws://localhost:2319/ws/ws

或者换种说法...

ws://<host>:<port>/<contextPath>/<endpointPath>

我最近遇到了同样的问题,这就是我如何解决我的问题。

我将 websocket 服务器的端口号从 8080 更改为 8335,这与我的 Apache 服务器的端口号相同。

<?php
use Ratchet\Server\IoServer;
use Ratchet\Http\HttpServer;
use Ratchet\WebSocket\WsServer;
use MyApp\Chat;

require dirname(__DIR__) . '/vendor/autoload.php';

$server = IoServer::factory(
    new HttpServer(
        new WsServer(
            new Chat()
        )
    ),
    8335
);

$server->run();

并在我的 javascript 代码中对实际连接进行了相同的更改

let conn = new WebSocket('ws://localhost:8335');
conn.onopen = function(e) {
    console.log("Connection established!");

    conn.send('Hello Everyone');
};

conn.onmessage = function(e) {
    console.log(e.data);
    $("#msg").append('<br>'+e.data);
};

您还可以按照下图在 Apache 控制器中查找空闲端口。谢谢

单击 Xampp 控制器上的 Netstart

在此处输入图片说明

点击刷新查看活动套接字、新套接字和旧套接字

选择属于勃艮第部分的任何端口

谢谢