我正在尝试使用 Vue 2 和laravel-echo-server通过 Laravel Echo 接收广播事件,但它不起作用。我也将 laravel-echo-server 设置为 dev 模式,可以看到我进入频道,但同时离开?如果这是问题所在,我该如何阻止这种情况发生并留在频道中?我还可以看到广播正在被触发,因为我正在运行php artisan queue:work redis
并且每次发送事件请求时我都会收到Processed: Illuminate\Broadcasting\BroadcastEvent
,所以我知道这也有效。为什么这行不通?我真的要疯了。
这是我的 bootstrap.js:
window._ = require('lodash');
window.$ = window.jQuery = require('jquery');
require('bootstrap-sass');
window.Vue = require('vue');
require('vue-resource');
Vue.http.interceptors.push((request, next) => {
request.headers.set('X-CSRF-TOKEN', Laravel.csrfToken);
next();
});
import Echo from "laravel-echo"
window.Echo = new Echo({
broadcaster: 'socket.io',
host: 'http://test.dev:6001'
});
我的 app.js:
require('./bootstrap');
Vue.component('alert', require('./components/Alert.vue'));
const app = new Vue({
el: '#app',
data: {
users: []
},
created: function () {
window.Echo.channel('test-channel')
.listen('UserSignedUp', (e) => {
console.log(e);
console.log('test');
});
}
});
我的活动:
<?php
namespace App\Events;
use Illuminate\Broadcasting\Channel;
use Illuminate\Queue\SerializesModels;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
class UserSignedUp implements ShouldBroadcast
{
use InteractsWithSockets, SerializesModels;
public $username;
public function __construct($username)
{
$this->username = $username;
}
public function broadcastOn()
{
return new Channel('test-channel');
}
}
最后,我的 laravel-echo-server.json:
{
"appKey": "somekey",
"authHost": "http://test.dev",
"authEndpoint": "/broadcasting/auth",
"database": "redis",
"databaseConfig": {
"redis": {
"port": "6379",
"host": "localhost"
},
"sqlite": {
"databasePath": "/database/laravel-echo-server.sqlite"
}
},
"devMode": true,
"host": "localhost",
"port": "6001",
"referrers": [],
"socketio": {},
"sslCertPath": "",
"sslKeyPath": ""
}
我在任何地方都没有收到任何错误,而且似乎我的事件正在被触发和处理,但 Echo 只是没有收到该事件。如前所述,每次触发事件时,我都会从控制台(laravel-echo-server 终端选项卡)获取此信息:
[TIME] - KEY joined channel: test-channel
[TIME] - KEY left channel: test-channel