Javascript 无法连接到 PHP Ratchet WebSocket 服务器答案

【问题标题】：Javascript can't connect to PHP Ratchet WebSocket serverJavascript 无法连接到 PHP Ratchet WebSocket 服务器
【发布时间】：2017-08-28 20:58:44
【问题描述】：

我一直在尝试在localhost上配置Ratchet，并且一直关注this tutorial。

我已经安装了 Composer 和 Ratchet，并且完全复制了该教程中的 PHP 代码。当我运行服务器并使用telnet 访问它时，我没有任何问题，它工作正常。

但是，当我尝试使用 JavaScript 建立连接（使用 HTML5 websockets）时，它没有连接 - 请求只是在一段时间后超时。我可以在 PHP 控制台和 telnet 中看到我的浏览器发送的初始 HTTP 请求消息，因此客户端显然可以很好地“连接”——就好像服务器没有确认这个请求一样。

我事先在 StackOverflow 和其他类似网站上查看了其他人的问题，有些人提到服务器必须发回 HTTP 回复，我尝试过这样做（对最近连接的使用 send 方法如果他们的消息以GET HTTP/1.1 开头）。我在 MDN 上查找了一些关于此的规范，并找到了 this guide，但我的实现对问题没有任何影响 - JavaScript 仍然无法连接。我不确定这是否是因为我错误地实现了握手代码，或者它根本不是我最初问题的解决方案。

WebSocket + Ratchet 指南都没有提到需要实现这一点，所以我怀疑这可能不是问题。

我尝试了8080 和8888 这两个端口，结果都一样。我在 Google Chrome 60 的 macOS 上使用 XAMPP。

这是我的 JavaScript 代码：

window.onload = function() {
    var conn = new WebSocket('ws://localhost:8080');
    conn.onmessage = function(e) {
        console.log(e.data);
    }
    conn.onopen = function(e) {
        console.log("Connection established!");
    }
}

这是我的 PHP 服务器代码 (bin/chat-server.php)：

<?php
use Ratchet\Server\IoServer;
use MyApp\Chat;

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

$server = IoServer::factory(
    new Chat(),
    8080
);

$server->run();

这里是聊天类 (src/MyApp/Chat.php)：

<?php
namespace MyApp;
use Ratchet\MessageComponentInterface;
use Ratchet\ConnectionInterface;

class Chat implements MessageComponentInterface {
    protected $clients;

    public function __construct() {
        $this->clients = new \SplObjectStorage;
    }

    public function onOpen(ConnectionInterface $conn) {
        // Store the new connection to send messages to later
        $this->clients->attach($conn);

        echo "New connection! ({$conn->resourceId})\n";

    }

    public function onMessage(ConnectionInterface $from, $msg) {
        $numRecv = count($this->clients) - 1;
        echo sprintf('Connection %d sending message "%s" to %d other connection%s' . "\n"
            , $from->resourceId, $msg, $numRecv, $numRecv == 1 ? '' : 's');
        foreach ($this->clients as $client) {
            if ($from !== $client) {
                // The sender is not the receiver, send to each client connected
                $client->send($msg);
            }
        }
    }

    public function onClose(ConnectionInterface $conn) {
        // The connection is closed, remove it, as we can no longer send it messages
        $this->clients->detach($conn);

        echo "Connection {$conn->resourceId} has disconnected\n";
    }

    public function onError(ConnectionInterface $conn, \Exception $e) {
        echo "An error has occurred: {$e->getMessage()}\n";

        $conn->close();
    }
}

【问题讨论】：

我也遇到了同样的问题，你有解决办法吗？我的代码在 localhost m 上运行良好，但在 Web 服务器上运行良好，

标签： javascript php html websocket ratchet

【解决方案1】：

因此，您不需要实现握手，Ratchet 会为您执行此操作。

要让我上面的代码正常工作，你需要做的就是确保你让它使用这样的 WebServer：

<?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()
        )
    ),
    8080
);

$server->run();

【讨论】：