如何使用 Apache + Ratchet + SSL + Laravel 配置 WebSocket？

Question

我的 websocket 服务器有问题。这也是我第一次使用这项技术。

我正在使用：

• 阿帕奇
• 棘轮（PHP）
• SSL（HTTPS 像往常一样在 443 上）
• 还有一个Laravel服务器，可能会改变服务器的配置。我是否需要修改我的服务器路径？ （我对Apache设置确实不太了解）。

我使用这个源来进行我的配置（它是法语）。

但是我无法使用 js 从客户端连接到我的 websocket。我仍然收到此错误：

与“wss://server_name.fr/ws/game”的 WebSocket 连接失败

这是我的网站的配置文件：

<VirtualHost server_name.fr:443>
        #ServerName www.example.com

        ServerAdmin webmaster@localhost
        DocumentRoot /var/www/html/server_name/public/
        <Directory /var/www/html/server_name/>
                AllowOverride All       
        </Directory>

        <Location "/ws/game">
                ProxyPass wss://localhost:1176
                ProxyPassReverse wss://localhost:1176
        </Location>

JavaScript：

var conn = new WebSocket('wss://server_name.fr/ws/game');
conn.onopen = function(e) {
    console.log("Connection established!");
};

conn.onmessage = function(e) {
    console.log(e.data);
};

我在端口 1176 上运行的 PHP 服务器（几乎就是这个例子）：

<?php require __DIR__ . '/vendor/autoload.php';

use Ratchet\Server\IoServer;
use Ratchet\Http\HttpServer;
use Ratchet\WebSocket\WsServer;
use Ratchet\MessageComponentInterface;
use Ratchet\ConnectionInterface;

define('APP_PORT', 1176);

class ServerGame implements MessageComponentInterface
{
    protected $lobby;
    protected $rooms;
    protected $client_in_room;

    public function __construct()
    {
        $this->lobby = array();
    }

    public function onOpen(ConnectionInterface $conn)
    {

    }

    public function onMessage(ConnectionInterface $conn, $msg)
    {

    }

    public function onClose(ConnectionInterface $conn)
    {

    }

    public function onError(ConnectionInterface $conn, \Exception $e)
    {

    }
}

$server = IoServer::factory(
    new HttpServer(
        new WsServer(
            new ServerGame()
        )
    ),
    APP_PORT
);
echo "Server created on port " . APP_PORT . "\n\n";
$server->run();

感谢您的帮助！

Answer 1

我发现问题了。我在没有 Laravel 的情况下再次尝试（即使它在那里也不应该成为问题）：

我使用的是 CHROME，Chrome 需要使用端口 443 来进行 wss。所以我必须在我的 httpdconf 中使用这个指令：

<VirtualHost my_site.fr:443>
    ProxyPass "/wss2/" "ws://localhost:1176/"

以及带有 websocket 连接的 JS 文件 :

var conn = new WebSocket('wss://my_site.fr:443/wss2/');

（对于我作为代理新手的理解）：

JS文件将使用wss协议发送请求，这是“wss://”部分，就像“https://”用于https等。所以当请求到达apache时。 Apache 将检查应用了哪些指令。所以它将应用我们上面的指令，因为：

• 它来自“443”端口上“my_site.fr”形式的 URL
• 然后它检查指令内要采取的操作。如：
• 由于 url 指向子目录 (my_site.fr:443/wss2/)，它会将请求“代理”到本地主机请求（谷歌不知道，所以这是允许的！），你可以让它指向你想要的任何东西。 （但要注意安全）

重要的是在js中添加端口，使其保持在443

然后它应该可以工作！