title: Laravel-Echo not subscribing to private channels through Vue.js
body: <p>I'm developing a project with Laravel (back) and Vuejs (with Vuex). I also use Sanctum:auth to authenticate users, laravel-websockets and Laravel-Echo for broadcast.</p>
  <p>Before, I had received an authentication problem on my console with the error: &quot;POST 'broadcast / auth' 404 not found&quot;.</p>
  <p>I was able to solve it after watching a tutorial that combined Sanctum, Vue and Laravel Echo in the same project.</p>
  <p>However, now that I test the service, I realize that I can listen to public channels but not private channels.</p>
  <p>From what I see on the websockets-dashboard, I don't even subscribe to private channels.</p>
  <p>In my archive .vue:</p>
  <pre><code>import room from './Room'
  import axios from 'axios'
  import Echo from 'laravel-echo'
  import Pusher from 'pusher-js'
  console.log(Pusher);
  ...
  export default {
  ...
     data: () =&gt; ({
          ...
          Echos:undefined
     }),
    
     mounted(){
      ...
      this.instantiatingEcho();
     },
     
     methods:{
     
     ...
     instantiatingEcho(){
     
          axios({
          method: &quot;GET&quot;,
          url: &quot;http://127.0.0.1:8000/api/users&quot;,
          headers: {
              Authorization: `Bearer ${this.$store.state.user.token}`,
          },
          })
          .then(({ data }) =&gt; {
              console.log(data);
  
              this.Echos = new Echo({
                  broadcaster: 'pusher',
                  key: process.env.VUE_APP_WEBSOCKETS_KEY,
                  wsHost: process.env.VUE_APP_WEBSOCKETS_SERVER,
                  wsPort: 6001,
                  forceTLS: false,
                  disableStats: true,
                  authorizer: (channel, options) =&gt; {
                      console.log(options);
                      return {
                          authorize: (socketId, callback) =&gt; {
                              axios({
                                  method: &quot;POST&quot;,
                                  url: &quot;http://127.0.0.1:8000/api/broadcasting/auth&quot;,
                                  headers: {
                                      Authorization: `Bearer ${this.$store.state.user.token}`,
                                  },
                                  data: {
                                      socket_id: socketId,
                                      channel_name: channel.name,
                                  },
                              })
                              .then((response) =&gt; {
                                  callback(false, response.data);
                              })
                              .catch((error) =&gt; {
                                  callback(true, error);
                              })
                          },
                      }
                  }
              })
          })
  
          this.enterinrom();
      },
  
      enterinrom(){
          this.Echos.private('Room.2')
          .listen('BroadcastRoom', (e) =&gt;{
              console.log(e)
          });    
      },
      
      }
  }
  </code></pre>
  <p>channels.php:</p>
  <pre><code> Broadcast::channel('Room.{id}', function ($id){
       return true;
   });
  </code></pre>
  <p>Event:</p>
  <pre><code> &lt;?php
  
  namespace App\Events;
  
  use Illuminate\Broadcasting\Channel;
  use Illuminate\Broadcasting\InteractsWithSockets;
  use Illuminate\Broadcasting\PresenceChannel;
  use Illuminate\Broadcasting\PrivateChannel;
  use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
  use Illuminate\Foundation\Events\Dispatchable;
  use Illuminate\Queue\SerializesModels;
  use App\Broadcasting\RoomChannel;
  
  class BroadcastRoom implements ShouldBroadcast
  {
      use Dispatchable, InteractsWithSockets, SerializesModels;
      public $mensage;
      public $id;
  
  
      public function __construct($mensage, $id)
      {
         $this-&gt;mensage = $mensage;
         $this-&gt;id = $id;
      }
  
      public function broadcastWith()
      {
         return [&quot;mensage&quot; =&gt; $this-&gt;mensage];
      }
  
  
      public function broadcastOn()
      {
          return new PrivateChannel('Room.'.$this-&gt;id);
      }
  
  }
  </code></pre>
  <p>api.php:</p>
  <pre><code>   ...
  
     Broadcast::routes(['middleware' =&gt; ['auth:sanctum']]);
  
     Route::middleware('auth:sanctum')-&gt;get('/users', function (Request $request) {
         return $request-&gt;user();
     });
  
     Route::post('/users/login', function (Request $request) {
  
     $user = User::where('email', $request-&gt;email)-&gt;first();
  
     if (!$user || ($request-&gt;password != $user-&gt;password)) {
          return response([
              'message' =&gt; ['These credentials do not match our records.']
              ], 404);
     }
  
     $token = $user-&gt;createToken('idiot-online-token')-&gt;plainTextToken;
  
     $response = [
          'user' =&gt; $user,
          'token' =&gt; $token
     ];
  
     return response($response, 201);
  });
  </code></pre>
  <p>web.php:</p>
  <pre><code>Route::get('/enviaevento/{id}', function ($id) {
      return event(new \App\Events\BroadcastRoom('Uai só...', $id));
  });
  </code></pre>
  <p>App\Providers\BroadcastServiceProvider::class in config/app.php is uncommented.</p>
  <p>Results:
  <a href="https://i.stack.imgur.com/73xU0.png" rel="nofollow noreferrer">enter image description here</a></p>
  <p>Someone would can help me?</p>