[英]Laravel-echo-server and Socket.io not firing command even though it's listening to channel
I've been trying to create a live chat application for a couple of days now, but it seems that I'm getting stuck on the first step;几天来我一直在尝试创建一个实时聊天应用程序,但似乎我在第一步上遇到了困难; Getting the project to fire an event.
让项目触发一个事件。 (I'm using redis and laravel-echo-server to get this whole thing running.) I'm having trouble getting laravel-echo to listen on a channel and fire a command when the event is fired, even though the laravel-echo-server and redis logs say otherwise.
(我正在使用 redis 和 laravel-echo-server 来运行这一切。)我无法让 laravel-echo 监听频道并在事件触发时触发命令,即使 laravel-echo -server 和 redis 日志另有说明。
Redis MONITOR log: Redis 监控日志:
127.0.0.1:6379> MONITOR
OK
1643223248.975531 [0 127.0.0.1:54786] "SELECT" "0"
1643223249.056260 [0 127.0.0.1:54786] "EVAL" "for i = 2, #ARGV do\n redis.call('publish', ARGV[i], ARGV[1])\nend" "0" "{\"event\":\"connected\",\"data\":{\"boolean\":true,\"socket\":null},\"socket\":null}" "IsConnected"
1643223249.056333 [0 lua] "publish" "IsConnected" "{\"event\":\"connected\",\"data\":{\"boolean\":true,\"socket\":null},\"socket\":null}"
1643223261.258602 [0 127.0.0.1:54809] "SELECT" "0"
1643223261.259042 [0 127.0.0.1:54809] "EVAL" "for i = 2, #ARGV do\n redis.call('publish', ARGV[i], ARGV[1])\nend" "0" "{\"event\":\"connected\",\"data\":{\"boolean\":true,\"socket\":null},\"socket\":null}" "IsConnected"
1643223261.259086 [0 lua] "publish" "IsConnected" "{\"event\":\"connected\",\"data\":{\"boolean\":true,\"socket\":null},\"socket\":null}"
1643223506.115183 [0 127.0.0.1:54958] "info"
1643223506.115765 [0 127.0.0.1:54959] "info"
1643223506.117294 [0 127.0.0.1:54958] "psubscribe" "*"
Laravel-echo-server log: Laravel-echo-server 日志:
L A R A V E L E C H O S E R V E R
version 1.6.3
⚠ 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: IsConnected
Event: connected
Channel: IsConnected
Event: connected
I'm just trying to do a simple console.log command, but for some reason it isn't working.我只是想执行一个简单的 console.log 命令,但由于某种原因它不起作用。
My bootstrap.js file:我的 bootstrap.js 文件:
window._ = require('lodash');
/**
* We'll load the axios HTTP library which allows us to easily issue requests
* to our Laravel back-end. This library automatically handles sending the
* CSRF token as a header based on the value of the "XSRF" token cookie.
*/
window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
import Echo from 'laravel-echo';
window.io = require(`socket.io-client`);
import $ from 'jquery';
window.Echo = new Echo({
broadcaster: `socket.io`,
host: window.location.hostname + ':6001',
encrypted: true,
authEndpoint: "api/broadcasting/auth",
csrfToken: $('meta[name="csrf-token"]').attr('content'),
auth: {
headers: {
Authorization: 'Bearer ' + $('meta[name="csrf-token"]').attr('content'),
},
},
});
My event php file:我的事件 php 文件:
<?php
namespace App\Events;
use Illuminate\Broadcasting\Channel;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Queue\SerializesModels;
class Connected implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;
public $boolean;
/**
* Create a new event instance.
*
* @return void
*/
public function __construct($boolean)
{
$this->boolean = $boolean;
}
/**
* Get the channels the event should broadcast on.
*
* @return \Illuminate\Broadcasting\Channel|array
*/
public function broadcastOn()
{
return new Channel('IsConnected');
}
public function broadcastAs() {
return 'connected';
}
}
The javascript file where I'm trying to listen for the event:我正在尝试侦听事件的 javascript 文件:
require('./bootstrap');
import { Checkbox, Button } from '@mui/material';
import * as React from 'react';
import ReactDOM from 'react-dom';
import { io } from 'socket.io-client';
window.Echo.channel("IsConnected").listen(".connected", (e)=>{
setConnected(true);
console.log("lmao");
});
function ChangeStatus() {
const [connected, setConnected] = React.useState(false);
async function testFire (){
await fetch("/api/v11/test-fire").then(res=>res.json()).then(res=>{
console.log(res);
}).catch(error=>console.log(error));
}
return(
<div>
<p>{connected? "Connected!" : "no"}</p>
<button onClick={(e)=>{testFire();}}></button>
</div>
);
}
ReactDOM.render(<ChangeStatus/>, document.querySelector("#lmao"));
My laravel-echo-server.json file:我的 laravel-echo-server.json 文件:
{
"authHost": "http://localhost:3000",
"authEndpoint": "/broadcasting/auth",
"clients": [],
"database": "redis",
"databaseConfig": {
"redis": {
"port": "6379",
"host": "localhost"
},
"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": false,
"allowOrigin": "",
"allowMethods": "",
"allowHeaders": ""
}
}
I apologize if I'm being a little vague, but I genuinely have no idea why this isn't working.如果我有点含糊,我深表歉意,但我真的不知道为什么这不起作用。 If you need more information I'm happy to oblige.
如果您需要更多信息,我很乐意效劳。
You can try to downgrade socket.io-client to version 2.3.0... for no aparent reason您可以尝试将 socket.io-client 降级到 2.3.0 版......没有明显的原因
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.