Bidirectional WebSockets in laravel? - node.js

Question

Anyone here familiar with bi-directional WebSockets in laravel?
Please note I am not talking about pusher+echo. pusher+echo cannot make a request to the server.
I have experience in express.js in which the socket can listen at server side.
I am looking for a similar feature.. any suggestion or help is greatly appreciated

Answer 1

Have you tried the laravel events method along with socketIO (as discussed in https://laracasts.com/discuss/channels/general-discussion/step-by-step-guide-to-installing-socketio-and-broadcasting-events-with-laravel-51)
In this method you could emit messages back to socket server, or you could initiate an XHR request to directly interact with the backend server (server with laravel).

Answer 2

I use Laravel Broadcasting with Laravel Websockets and Laravel Echo for server to client communication while using the code below for client to server communication using websockets api. Big thanks to Acadea.io. Please refer to the following:
BaseSocketHandler.php
namespace App\Websockets\SocketHandler;
use BeyondCode\LaravelWebSockets\Apps\App;
use BeyondCode\LaravelWebSockets\QueryParameters;
use BeyondCode\LaravelWebSockets\WebSockets\Exceptions\UnknownAppKey;
use Ratchet\ConnectionInterface;
use Ratchet\WebSocket\MessageComponentInterface;
abstract class BaseSocketHandler implements MessageComponentInterface
{
protected function verifyAppKey(ConnectionInterface $connection)
{
$appKey = QueryParameters::create($connection->httpRequest)->get('appKey');
if (!$app = App::findByKey($appKey)) {
throw new UnknownAppKey($appKey);
}
$connection->app = $app;
return $this;
}
protected function generateSocketId(ConnectionInterface $connection)
{
$socketId = sprintf('%d.%d', random_int(1, 1000000000), random_int(1, 1000000000));
$connection->socketId = $socketId;
return $this;
}
function onOpen(ConnectionInterface $conn)
{
dump('on opened');
$this->verifyAppKey($conn)->generateSocketId($conn);
}
function onClose(ConnectionInterface $conn)
{
dump('closed');
}
function onError(ConnectionInterface $conn, \Exception $e)
{
dump($e);
dump('onerror');
}
}
CustomSocketHandler
namespace App\Websockets\SocketHandler;
use Ratchet\ConnectionInterface;
use Ratchet\RFC6455\Messaging\MessageInterface;
use Ratchet\WebSocket\MessageComponentInterface;
class CustomSocketHandler extends BaseSocketHandler implements MessageComponentInterface
{
public function onOpen(ConnectionInterface $connection)
{
// TODO: Implement onOpen() method.
}
public function onClose(ConnectionInterface $connection)
{
// TODO: Implement onClose() method.
}
public function onError(ConnectionInterface $connection, \Exception $e)
{
// TODO: Implement onError() method.
}
public function onMessage(ConnectionInterface $connection, MessageInterface $msg)
{
$body = json_decode(collect(json_decode($msg->getPayload(), true)), true);
$access_token = $body["access_token"];
$authenticateUserByAccessToken = new AuthenticateUserByAccessToken();
$chat_user = $authenticateUserByAccessToken->getAuthenticatedUser($access_token);
// TODO: Implement onMessage() method.
$dataToBeReturned = json_encode($dataToBeReturned);
$connection->send($dataToBeReturned);
}
web
use App\Websockets\SocketHandler\CustomSocketHandler;
use BeyondCode\LaravelWebSockets\Facades\WebSocketsRouter;
WebSocketsRouter::webSocket('/socket/custom-socket-url', CustomSocketHandler::class);
JS
function functionName(access_token, id) {
const socket = new WebSocket(
`wss://${window.location.hostname}:${process.env.MIX_LARAVEL_WEBSOCKETS_PORT}/socket/custom-socket-url?appKey=${process.env.MIX_PUSHER_APP_KEY}`
);
socket.onopen = function (event) {
// console.log("on open", event);
};
socket.onclose = function (event) {
// console.log("on close", event);
};
socket.onmessage = function (event) {
// console.log("on message", event);
};
socket.send(
JSON.stringify({
access_token: access_token, //optional JWT Auth Token
payload: {
id: id,
},
})
);
socket.close();
}
Optional. If you want to authenticate your websocket connection (using jwt)
namespace App\Websockets\SocketHandler;
use App\Models\AuthenticationModelToBeUsed;
use Illuminate\Support\Facades\Config;
use Illuminate\Support\Facades\Log;
use Tymon\JWTAuth\Facades\JWTAuth;
class AuthenticateUserByAccessToken
{
public function getAuthenticatedUser($access_token)
{
Config::set('auth.providers.users.model', AuthenticationModelToBeUsed::class);
try {
JWTAuth::setToken($access_token);
if (!$user = JWTAuth::toUser($access_token)) {
return response()->json(array('message' => 'user_not_found'), 404);
}
} catch (\Tymon\JWTAuth\Exceptions\TokenExpiredException $e) {
return response()->json(array('message' => 'token_expired'), 404);
} catch (\Tymon\JWTAuth\Exceptions\TokenInvalidException $e) {
return response()->json(array('message' => 'token_invalid'), 404);
} catch (\Tymon\JWTAuth\Exceptions\JWTException $e) {
return response()->json(array('message' => 'token_absent'), 404);
}
Log::info($user);
return $user;
}
}