Getting 403 error when implementing private channels in Laravel Pusher multi-room chat app

I’m developing a multi-room chat application using Laravel and Pusher. I’m trying to implement private channels for each room, but I’m encountering a 403 error with the message “POST http://127.0.0.1:8000/broadcasting/auth”. I suspect the issue might be related to the custom middleware I’m using.

Here’s my setup:

web.php:

Auth::routes();

Route::get('/', [AppHttpControllersHomeController::class, 'welcome'])->name('welcome');

Route::group(['middleware' => WelcomeMiddleware::class], function () {
  Route::post('/create', [AppHttpControllersHomeController::class, 'create'])->name('create');
  Route::get('/home', [AppHttpControllersHomeController::class, 'home'])->name('home');
  Route::get('/select', [AppHttpControllersHomeController::class, 'select'])->name('select');
  Route::post('/sendMessage', [MessagesController::class, 'index']);
  Route::get('/room/{id}', [AppHttpControllersHomeController::class, 'room'])->name('room');
});

WelcomeMiddleware.php:

class WelcomeMiddleWare
{
  /**
   * Handle an incoming request.
   *
   * @param  Closure(IlluminateHttpRequest): (SymfonyComponentHttpFoundationResponse)  $next
   */
  public function handle(Request $request, Closure $next): Response
  {
    if (!$request->hasCookie('chat_session')) {
      return redirect()->route('welcome');
    }
    return $next($request);
  }
}

MessagesController.php

public function index(Request $request)
  {
    $name_id = session()->get("name_id");
    $name = session()->get("name");
    $room_id = Name::where('id', $name_id)->first()->room_id;
    logger("index ", ['channel' => $room_id]);
    event(new Chat(
      $name,
      $request->input('message'),
      $room_id,
    ));

    return true;
  }

Events/Chat.php

public function __construct($username, $message, $room_id)
  {
    $this->username = $username;
    $this->message = $message;
    $this->room_id = $room_id;
  }

  /**
   * Get the channels the event should broadcast on.
   *
   * @return array<int, IlluminateBroadcastingChannel>
   */
  public function broadcastOn(): array
  {
    return [
      // new PrivateChannel('room' . $this->room_id),
      new PrivateChannel('room'),
    ];
  }

I tried the following setup I found online, but I still get a 403 error:

channels.php

Broadcast::routes(['middleware' => WelcomeMiddleware::class], function () {
  Broadcast::channel('room', function () {
    return true;
  });
});

BroadcastServiceProvider.php

public function boot(): void
  {
    Broadcast::routes(['middleware' => WelcomeMiddleware::class]);
    require base_path('routes/channels.php');
  }

I’m super noob of Laravel and Pusher and I’m not sure how breadcasting works.

Any help on resolving this issue would be greatly appreciated. Thank you!