Laravel Echo Server、Redis、Socket.IO:似乎无法让它们工作
Laravel Echo Server, Redis, Socket.IO: Can't seem to make them work
我正在使用 Laravel 开发实时应用程序。由于我不想使用 Pusher,我正在尝试使用 Laravel Echo Server, Redis, and Socket.IO. However, I'm having a problem with this stack. The client (browser) can't seem to receive data from events. I also use Intertia and Vue for the frontend. It's also worth noting that I use Laragon 作为我的本地开发环境来使 websockets 工作。
我的.env
,部分省略:
APP_URL=http://malbe.test
BROADCAST_DRIVER=redis
CACHE_DRIVER=file
QUEUE_CONNECTION=redis
SESSION_DRIVER=file
SESSION_LIFETIME=120
MIX_APP_URL="${APP_URL}"
我的laravel-echo-server.json
:
{
"authHost": "http://malbe.test",
"authEndpoint": "/broadcasting/auth",
"clients": [
{
"appId": "omitted",
"key": "omitted"
}
],
"database": "redis",
"databaseConfig": {
"redis": {},
"sqlite": {
"databasePath": "/database/laravel-echo-server.sqlite"
}
},
"devMode": true,
"host": null,
"port": "6001",
"protocol": "http",
"socketio": {},
"secureOptions": 67108864,
"sslCertPath": "",
"sslKeyPath": "",
"sslCertChainPath": "",
"sslPassphrase": "",
"subscribers": {
"http": true,
"redis": true
},
"apiOriginAllow": {
"allowCors": true,
"allowOrigin": "http://malbe.test:80",
"allowMethods": "GET, POST",
"allowHeaders": "Origin, Content-Type, X-Auth-Token, X-Requested-With, Accept, Authorization, X-CSRF-TOKEN, X-Socket-Id"
}
}
我在 database.php
上的 redis 配置:
注意:我使用 predis
因为即使我在 PHP 扩展上安装了 dll,我似乎也无法使 phpredis
工作。
'redis' => [
// 'client' => env('REDIS_CLIENT', 'phpredis'),
'client' => env('REDIS_CLIENT', 'predis'),
'options' => [
'cluster' => env('REDIS_CLUSTER', 'redis'),
// 'prefix' => env('REDIS_PREFIX', Str::slug(env('APP_NAME', 'laravel'), '_').'_database_'),
'prefix' => "",
],
'default' => [
'url' => env('REDIS_URL'),
'host' => env('REDIS_HOST', '127.0.0.1'),
'password' => env('REDIS_PASSWORD', null),
'port' => env('REDIS_PORT', '6379'),
'database' => env('REDIS_DB', '0'),
],
'cache' => [
'url' => env('REDIS_URL'),
'host' => env('REDIS_HOST', '127.0.0.1'),
'password' => env('REDIS_PASSWORD', null),
'port' => env('REDIS_PORT', '6379'),
'database' => env('REDIS_CACHE_DB', '1'),
],
],
我的 Laravel 事件:
class SampleEvent implements ShouldBroadcast {
use Dispatchable, InteractsWithSockets, SerializesModels;
public function __construct()
{
//
}
public function broadcastOn() {
return new Channel("my-channel");
}
public function broadcastWith() {
return ["data"=>"Hello"];
}
}
我的 Echo 在 bootstrap.js
初始化:
import Echo from "laravel-echo";
window.io = require("socket.io-client");
if (typeof window.io !== "undefined") {
window.Echo = new Echo({
broadcaster: "socket.io",
host: process.env.MIX_APP_URL + ":6001"
});
}
订阅Echo服务器的Vue页面
export default {
props: ["foo"],
mounted: function () {
window.Echo.channel("my-channel").listen("SampleEvent", (d) => console.log(d));
}
};
使用这 3 个命令 运行:
laravel-echo-server start
npm run watch
php artisan queue:work
我尝试使用 Tinker 和 GET 请求广播一个事件。
Route::get("/broadcast", function () {
event(new \App\Events\SampleEvent);
// also tried
// broadcast(new \App\Events\SampleEvent);
});
队列工作人员处理事件;
[2020-12-24 11:07:35][n9FKq0n6C6QOKa2f1JBzWcCqgYqLiDvU] Processing: App\Events\SampleEvent
[2020-12-24 11:07:35][n9FKq0n6C6QOKa2f1JBzWcCqgYqLiDvU] Processed: App\Events\SampleEvent
并且 laravel-echo-server
在广播事件时输出此信息;
L A R A V E L E C H O S E R V E R
version 1.6.2
⚠ Starting server in DEV mode...
✔ Running at localhost on port 6001
✔ Channels are ready.
✔ Listening for http events...
✔ Listening for redis events...
Server ready!
Channel: my-channel
Event: App\Events\SampleEvent
客户端没有显示任何错误。下面是 Developer Console 上的网络选项卡:
Browser Network Tab
当我关闭 laravel-echo-server
而客户端仍处于打开状态时,每隔一秒就会出现此错误:
ERR_CONNECTION_REFUSED
抱歉这个冗长的问题,我只是想展示我的所有配置,以便我可以帮助您解决这个问题。谁能指出我正确的解决方案?谢谢!
我认为你的配置代码是正确的。你可以在 vue 中看到 package.json
的配置:
"socket.io-client": "^2.4.0",
如果你的"socket.io-client"
是>=3
,你最好改成2.4.0
。和 运行:
sudo cnpm i socket.io@2.4.0
Echo不支持也不打算支持Socket IO >= v3
更多信息在这里:
https://github.com/laravel/echo/issues/290
我正在使用 Laravel 开发实时应用程序。由于我不想使用 Pusher,我正在尝试使用 Laravel Echo Server, Redis, and Socket.IO. However, I'm having a problem with this stack. The client (browser) can't seem to receive data from events. I also use Intertia and Vue for the frontend. It's also worth noting that I use Laragon 作为我的本地开发环境来使 websockets 工作。
我的.env
,部分省略:
APP_URL=http://malbe.test
BROADCAST_DRIVER=redis
CACHE_DRIVER=file
QUEUE_CONNECTION=redis
SESSION_DRIVER=file
SESSION_LIFETIME=120
MIX_APP_URL="${APP_URL}"
我的laravel-echo-server.json
:
{
"authHost": "http://malbe.test",
"authEndpoint": "/broadcasting/auth",
"clients": [
{
"appId": "omitted",
"key": "omitted"
}
],
"database": "redis",
"databaseConfig": {
"redis": {},
"sqlite": {
"databasePath": "/database/laravel-echo-server.sqlite"
}
},
"devMode": true,
"host": null,
"port": "6001",
"protocol": "http",
"socketio": {},
"secureOptions": 67108864,
"sslCertPath": "",
"sslKeyPath": "",
"sslCertChainPath": "",
"sslPassphrase": "",
"subscribers": {
"http": true,
"redis": true
},
"apiOriginAllow": {
"allowCors": true,
"allowOrigin": "http://malbe.test:80",
"allowMethods": "GET, POST",
"allowHeaders": "Origin, Content-Type, X-Auth-Token, X-Requested-With, Accept, Authorization, X-CSRF-TOKEN, X-Socket-Id"
}
}
我在 database.php
上的 redis 配置:
注意:我使用 predis
因为即使我在 PHP 扩展上安装了 dll,我似乎也无法使 phpredis
工作。
'redis' => [
// 'client' => env('REDIS_CLIENT', 'phpredis'),
'client' => env('REDIS_CLIENT', 'predis'),
'options' => [
'cluster' => env('REDIS_CLUSTER', 'redis'),
// 'prefix' => env('REDIS_PREFIX', Str::slug(env('APP_NAME', 'laravel'), '_').'_database_'),
'prefix' => "",
],
'default' => [
'url' => env('REDIS_URL'),
'host' => env('REDIS_HOST', '127.0.0.1'),
'password' => env('REDIS_PASSWORD', null),
'port' => env('REDIS_PORT', '6379'),
'database' => env('REDIS_DB', '0'),
],
'cache' => [
'url' => env('REDIS_URL'),
'host' => env('REDIS_HOST', '127.0.0.1'),
'password' => env('REDIS_PASSWORD', null),
'port' => env('REDIS_PORT', '6379'),
'database' => env('REDIS_CACHE_DB', '1'),
],
],
我的 Laravel 事件:
class SampleEvent implements ShouldBroadcast {
use Dispatchable, InteractsWithSockets, SerializesModels;
public function __construct()
{
//
}
public function broadcastOn() {
return new Channel("my-channel");
}
public function broadcastWith() {
return ["data"=>"Hello"];
}
}
我的 Echo 在 bootstrap.js
初始化:
import Echo from "laravel-echo";
window.io = require("socket.io-client");
if (typeof window.io !== "undefined") {
window.Echo = new Echo({
broadcaster: "socket.io",
host: process.env.MIX_APP_URL + ":6001"
});
}
订阅Echo服务器的Vue页面
export default {
props: ["foo"],
mounted: function () {
window.Echo.channel("my-channel").listen("SampleEvent", (d) => console.log(d));
}
};
使用这 3 个命令 运行:
laravel-echo-server start
npm run watch
php artisan queue:work
我尝试使用 Tinker 和 GET 请求广播一个事件。
Route::get("/broadcast", function () {
event(new \App\Events\SampleEvent);
// also tried
// broadcast(new \App\Events\SampleEvent);
});
队列工作人员处理事件;
[2020-12-24 11:07:35][n9FKq0n6C6QOKa2f1JBzWcCqgYqLiDvU] Processing: App\Events\SampleEvent
[2020-12-24 11:07:35][n9FKq0n6C6QOKa2f1JBzWcCqgYqLiDvU] Processed: App\Events\SampleEvent
并且 laravel-echo-server
在广播事件时输出此信息;
L A R A V E L E C H O S E R V E R
version 1.6.2
⚠ Starting server in DEV mode...
✔ Running at localhost on port 6001
✔ Channels are ready.
✔ Listening for http events...
✔ Listening for redis events...
Server ready!
Channel: my-channel
Event: App\Events\SampleEvent
客户端没有显示任何错误。下面是 Developer Console 上的网络选项卡:
Browser Network Tab
当我关闭 laravel-echo-server
而客户端仍处于打开状态时,每隔一秒就会出现此错误:
ERR_CONNECTION_REFUSED
抱歉这个冗长的问题,我只是想展示我的所有配置,以便我可以帮助您解决这个问题。谁能指出我正确的解决方案?谢谢!
我认为你的配置代码是正确的。你可以在 vue 中看到 package.json
的配置:
"socket.io-client": "^2.4.0",
如果你的"socket.io-client"
是>=3
,你最好改成2.4.0
。和 运行:
sudo cnpm i socket.io@2.4.0
Echo不支持也不打算支持Socket IO >= v3 更多信息在这里: https://github.com/laravel/echo/issues/290