Laravel SocketIO is not executing callback functions

Laravel SocketIO is not executing callback functions

I have created a Laravel project which has a SocketIO server using&nbsp;<a href="https://github.com/Askedio/laravel-ratchet" target="_blank" style="color: rgb(0, 89, 153);">Laravel-Ratchet</a>.

I have created a Laravel project which has a SocketIO server using Laravel-Ratchet.

<?php
namespace App\Http\Listeners;

use Ratchet\ConnectionInterface; use Ratchet\MessageComponentInterface; use Ratchet\Server\IoServer;

class Chat extends IoServer implements MessageComponentInterface { protected $clients;

public function __construct() { $this->clients = new \SplObjectStorage; }

/** * When a new connection is opened it will be passed to this method * @param ConnectionInterface $conn The socket/connection that just connected to your application * @throws \Exception */ function onOpen(ConnectionInterface $conn) { echo "someone connected\n";

   $this-&gt;clients-&gt;attach($conn);

   $conn-&gt;send('Welcome!');

}

/** * This is called before or after a socket is closed (depends on how it's closed). SendMessage to $conn will not result in an error if it has already been closed. * @param ConnectionInterface $conn The socket/connection that is closing/closed * @throws \Exception */ function onClose(ConnectionInterface $conn) { echo "someone has disconnected\n";

   $this-&gt;clients-&gt;detach($conn);

}

/** * If there is an error with one of the sockets, or somewhere in the application where an Exception is thrown, * the Exception is sent back down the stack, handled by the Server and bubbled back up the application through this method * @param ConnectionInterface $conn * @param \Exception $e * @throws \Exception */ function onError(ConnectionInterface $conn, \Exception $e) { echo "An error has occurred: {$e->getMessage()}\n";

    $conn-&gt;close();

}

/** * Triggered when a client sends data through the socket * @param \Ratchet\ConnectionInterface $from The socket/connection that sent the message to your application * @param string $msg The message received * @throws \Exception */ function onMessage(ConnectionInterface $from, $msg) { echo "Someone sent a message: {$msg}\n";

   foreach ($this-&gt;clients as $client) {
       if ($from !== $client) {
           $client-&gt;send('Hello');
       }
   }
}

}

Which is ran with php artisan ratchet:serve --driver=IoServer -z --class App\Http\Listeners\Chat

On the frontend I am working with Angular 7 and have tried multiple sockets. Below is an attempt using socket.io-client

chat.socket.ts:

public ngOnInit():void {
  this.socket = io(
    'http://localhost:8080',
    {
      path: '/'
    }
  );

this.connection = this.getMessages().subscribe( (message:any) => { console.log(message);

  this.messages.push(message);
}

); }

public ngOnDestroy(): void { this.connection.unsubscribe(); }

getMessages() { return new Observable( observer => { this.socket.on( 'message', (data) => { console.log(data);

      observer.next(data);
    }
  );

  return () =&gt; {
    this.socket.disconnect();
  };
}

); }

I have also tried using ngx-socket-io with the same problem.

chat.socket.ts:

@Injectable()
export class ChatSocket extends Socket {
   constructor() {
     super(
      {
        url: 'http://localhost:8080',
        options: {
          path: '/'
        }
      }
   );
  }
}

chat.page.ts:

public ngOnInit():void {
  this.socket.emit('init');

this.socket.emit( 'message', 'Hello, World', function() { console.log('here'); } ); }

My network tab shows that it firing the response but immediately receives net::ERR_INVALID_RESPONSE with no response.

Network Request

Here are my socket headers:

Socket Headers

When using socket-io.client I get this after a long line of failures:

enter image description here

While that is happening my terminal shows that I am receiving the connection and disconnect events sent from the app. But there are no messages being received from the server nor being caught by the server.

Here is my log:

Starting IoServer server on: 0.0.0.0:8080

someone connected

someone sent a message: GET /chat/?EIO=3&transport=polling&t=MWjzh2Z HTTP/1.1 Host: localhost:8080 Connection: keep-alive Pragma: no-cache Cache-Control: no-cache Accept: / Origin: http://evil.com/ User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36 DNT: 1 Referer: http://localhost:8100/chat Accept-Encoding: gzip, deflate, br Accept-Language: en-US,en;q=0.9 Cookie: XDEBUG_SESSION=XDEBUG_ECLIPSE; PHPSESSID=d3c24da76bc02d17a4ae8f7eadeabe07

someone has disconnected

Any ideas what is going wrong?

laravel angular-js

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

Angular 9 select2 with laravel 7.2 backend data

Angular 9 select2 with laravel 7.2 backend data. Angular with laravel backend. Angular 9 with laravel phpmysql database. Angular laravel

Php how to delete multiple rows through checkbox using ajax in laravel

In this article i will let you know to delete multiple rows through checkbox using ajax in laravel and before delete we will give a confirmation message.

Integrate PHP Laravel 5.8 APIs in Angular 7

For PHP Laravel APIs to integrate in Angular 7, we have to write APIs in api.php file in Laravel which is in the routes folder in Laravel project structure. For the sake of this article, we are using example of User API.

Build a Basic CRUD App with Laravel and Angular

This tutorial teaches you how to build a simple CRUD application with a Laravel backend API and an Angular frontend.

Laravel 7 VUE JS Example | Laravel 7 VUE JS Tutorial For Beginners

Laravel 7 VUE JS Exmples. Here you will learn laravel vue js from scratch. This tutorial provides following laravel vue js tutorial from scratch. <div class="gen-info-box"><b>Recommended:-</b> <a...