diff --git a/Readme.md b/Readme.md index 21834c1..a48b62a 100644 --- a/Readme.md +++ b/Readme.md @@ -24,7 +24,16 @@ Publish configuration file: php artisan vendor:publish --tag=jacked-server ``` -Add the Service Provider to the `config/app.php`: +If on laravel 11, add the Service Provider at the `bootstrap/providers.php`: + +```php + { + fetch('/broadcasting/auth?channel_name=actions-channel', { + headers: { + 'Accept': 'application/json', + }, + }) + .then(response => response.json()) + .then(data => callback(data.auth)) // this is the token (data.auth) + .catch(error => console.error(error)); +}; ``` This will give you a single use token like follows: ``` { - "token": string + "auth": string } ``` -A programmatic way is to use Conveyor's JwtToken service: +> **Important:** refer to the Laravel Broadcasting documentation for more information on how to authorize channels and how to generate tokens. There is a way to generate a token in the backend as well. + +**Step 4**: + +Add this to the bootstrap.js file of your Laravel app so the Conveyor client is available globally: + +```js +import Conveyor from "socket-conveyor-client"; + +window.Conveyor = Conveyor; +``` + +**Step 5**: + +> This is a step from the Conveyor Laravel Broadcaster package. Make sure to check at that documentation. + +Build a WS Client that you can use to interact with your WS Server. The first step is to create a simple route with your websocket server information: + +```php +use Illuminate\Support\Facades\Route; +use Illuminate\Support\Facades\Auth; + +Route::get('/ws-client', function () { + Auth::loginUsingId(1); // here we authorize for the sake of the example. + + $protocol = config('jacked-server.ssl-enabled') ? 'wss' : 'ws'; + $port = config('jacked-server.ssl-enabled') ? config('jacked-server.ssl-port') : config('jacked-server.port'); + + return view('ws-client', [ + 'protocol' => $protocol, + 'uri' => '127.0.0.1', + 'wsPort' => $port, + 'channel' => 'private-actions-channel', + ]); +}); +``` + +**Step 6**: + +> This is a step from the Conveyor Laravel Broadcaster package. Make sure to check at that documentation. + +Implement your sample blade template that interacts with this websocket service, properly authorizing an interacting with the channel (`resources/views/ws-client.blade.php`): + +```html + + + WS Client + @vite(['resources/css/app.css', 'resources/js/app.js']) + + + + + + + + + + + +``` + +**Step 7**: + +> This is a step from the Conveyor Laravel Broadcaster package. Make sure to check at that documentation. + +Now you protect your channel with a "channel route" (a specific laravel detail). You do this by adding the following to your `routes/channels.php`: + +```php +use App\Models\User; +use Illuminate\Support\Facades\Broadcast; + +Broadcast::channel('actions-channel', function (User $user) { + return true; // we are authorizing any user here +}); +``` + +**Step 8**: + +Enable Broadcaster at the `config/jacked-server.php`: ```php -use Kanata\LaravelBroadcaster\Services\JwtToken; - -/** @var \Kanata\LaravelBroadcaster\Models\Token $token */ -$token = JwtToken::create( - name: 'some-token', - userId: auth()->user()->id, - expire: null, - useLimit: 1, -); -``` - -> **IMPORTANT:** This token will get expired after the limited usage. + [ + // ... + 'broadcaster' => true, + ], +] +``` + +**Step 9**: + +Run the server: + +```shell +php artisan jacked:server +``` + +**Step 9**: + +Now visit the `/ws-client` route. You should be able to interact with the WebSocket server there.