Laravel Pusher Websocket在HTTPS上无法工作

Question

我正在使用 Laravel 5.8，在我们的应用程序中使用 PUSHER 的 Web Socket。在本地或使用 HTTP 模式时，它可以完美地进行广播。但是，当我将设置更新为 HTTPS 时，广播就无法正常工作了。

Any hints on this ? anyone ?

我尝试过

#客户端

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    wsHost: window.location.hostname,
    encrypted: false,
    // wsPort: 6001,
    // wssPort: 6001,
    disableStats: true,
    forceTLS: true,
    enabledTransports: ['ws', 'wss']
});

并且

#服务器端

'pusher' => [
    'driver' => 'pusher',
    'key' => env('PUSHER_APP_KEY'),
    'secret' => env('PUSHER_APP_SECRET'),
    'app_id' => env('PUSHER_APP_ID'),
    'options' => [
        'cluster' => env('PUSHER_APP_CLUSTER'),
        'scheme' => 'http',
        'useTLS' => true,
        'debug' => true,
        'curl_options' => [
            CURLOPT_SSL_VERIFYHOST => 0,
            CURLOPT_SSL_VERIFYPEER => 0,
            CURLOPT_IPRESOLVE => CURL_IPRESOLVE_V4
        ]
    ],
],

同样的结果！不起作用！

在本地Chrome上工作得非常完美，但对于Firefox而言……

我在控制台中看到了这个：

- code-8

---

你的控制台或浏览器网络选项卡中有任何错误吗？ - Maarten Veerman

我在网络选项卡或控制台选项卡中没有看到任何错误。 - code-8

尝试关闭加密？通常当没有日志或错误时，请确保驱动程序正确设置为推送器，并且app_key应该相同。如果出现握手错误或前端控制台中的身份验证错误，则应输出。 - GTHell

@MaartenVeerman：我在Firefox上检查了一下，现在控制台上出现了你预测的错误。 - code-8

@cyber8200问题已经解决了吗？ - Maarten Veerman

Answer 1

您没有连接到正确的端口，或者 Echo 的默认端口不是推动器应该使用的默认端口。请在您的 JavaScript 前端.env文件中定义正确的端口号。(我不知道您的库设置，但有时候您可以使用一个.env.local文件，例如在Vue设置中)。

Pusher似乎使用默认的Web端口80和443，如此描述：https://pusher.com/docs/channels/library_auth_reference/pusher-websockets-protocol

在您在.env文件中定义端口后，更改您的JavaScript代码：

wsPort: process.env.MIX_PUSHER_WS_PORT, 
wssPort: process.env.MIX_PUSHER_WSS_PORT,

不要忘记重建你的前端。

- Maarten Veerman

---

不要忘记重新构建你的前端，并清除浏览器缓存中缓存的JavaScript文件 ;) - dbf

Answer 2

我因声望低无法编写评论，所以在此处写下：

尝试将'scheme' => 'http'中的HTTP更改为HTTPS。

在websockets.php中检查此选项：

'verify_peer' => false,

还请查看此文章中的配置示例：
https://www.digitalocean.com/community/questions/how-to-configure-laravel-websockets-with-ssl-on-nginx

- Pavel Cechir

Answer 3

既然您提到这是在本地发生的，您可能想查看此问题，因为它可能与您所经历的情况有关... 本质上，有一个概述的解决方法，可以让Firefox使用套接字与自签名证书一起工作...

另外，如果您从构造函数中删除“wss”，会发生什么：

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    wsHost: window.location.hostname,
    encrypted: false,
    // wsPort: 6001, <-- Should these be commented out?
    // wssPort: 6001, <-- Should these be commented out?
    disableStats: true,
    forceTLS: true,
    enabledTransports: ['ws'] // removed wss
});

此外，您已经将端口注释掉了...这似乎很奇怪，因为您需要一个端口来连接套接字服务。

- rexfordkelly