使用 Laravel Websockets 绑定 Laravel Echo 上的回调

Question

我想知道我的用户何时出现连接错误或连接断开。我读过很多文章说这是可能的，但我一无所获，我开始认为这可能是我正在使用的第三方（例如https://github.com/beyondcode/laravel-websockets ）的问题，有人遇到过这样的问题吗？

以下根本不产生任何日志。

window.Echo.connector.pusher.bind('reconnect', (channel, data) => {
    console.log('RE-CONNECTED');
});

window.Echo.connector.pusher.bind('reconnecting', (channel, data) => {
    console.log('re-connecting...');
});

window.Echo.connector.pusher.bind('reconnect_error', (channel, data) => {
    console.log('reconnection error!');
});

window.Echo.connector.pusher.bind('reconnect_attempt', (channel, data) => {
    console.log('re-connecting...');
});

window.Echo.connector.pusher.bind('connect_error', (channel, data) => {
    console.log('connect error...');
});

window.Echo.connector.pusher.bind('error', (channel, data) => {
    console.log('error...');
});

window.Echo.connector.pusher.bind_global((channel, data) => {
    console.log(channel, data);
});

如果我使用建议的类似内容

window.Echo.connector.socket.on('connect_error', function(){
    console.log('connected', window.Echo.socketId());
});

window.Echo.connector.socket.on('connect', function(){
    console.log('connected', window.Echo.socketId());
});

window.Echo.connector.socket.on('disconnect', function(){
    console.log('disconnected');
});

window.Echo.connector.socket.on('reconnecting', function(attemptNumber){
    console.log('reconnecting', attemptNumber);
});

我明白了Uncaught TypeError: Cannot read property 'on' of undefined

Answer 1

我发现了绑定事件的正确方法；

window.Echo.connector.pusher.connection.bind($eventName, (payload) => {});

事件参考可以在这里找到https://pusher.com/docs/channels/using_channels/connection

window.Echo.connector.pusher.connection.bind('connecting', (payload) => {

    /**
     * All dependencies have been loaded and Channels is trying to connect.
     * The connection will also enter this state when it is trying to reconnect after a connection failure.
     */

    console.log('connecting...');

});

window.Echo.connector.pusher.connection.bind('connected', (payload) => {

    /**
     * The connection to Channels is open and authenticated with your app.
     */

    console.log('connected!', payload);
});

window.Echo.connector.pusher.connection.bind('unavailable', (payload) => {

    /**
     *  The connection is temporarily unavailable. In most cases this means that there is no internet connection.
     *  It could also mean that Channels is down, or some intermediary is blocking the connection. In this state,
     *  pusher-js will automatically retry the connection every 15 seconds.
     */

    console.log('unavailable', payload);
});

window.Echo.connector.pusher.connection.bind('failed', (payload) => {

    /**
     * Channels is not supported by the browser.
     * This implies that WebSockets are not natively available and an HTTP-based transport could not be found.
     */

    console.log('failed', payload);

});

window.Echo.connector.pusher.connection.bind('disconnected', (payload) => {

    /**
     * The Channels connection was previously connected and has now intentionally been closed
     */

    console.log('disconnected', payload);

});

window.Echo.connector.pusher.connection.bind('message', (payload) => {

    /**
     * Ping received from server
     */

    console.log('message', payload);
});