푸셔 사용 시 Larabel 5.7의 '/broadcasting/auth 401(Unauthorized)' 오류를 수정하는 방법

푸셔 사용 시 Larabel 5.7의 '/broadcasting/auth 401(Unauthorized)' 오류를 수정하는 방법

SPA에서 푸셔를 셋업하려고 합니다.Larabel 5.7과 Vus js에서 앱을 개발하여 인증에 jwt를 사용하고 있습니다.

My Boostrap.js는 다음과 같습니다.

window.Echo = new Echo({
broadcaster: 'pusher',
key: process.env.MIX_PUSHER_APP_KEY,
cluster: process.env.MIX_PUSHER_APP_CLUSTER,
encrypted: true,
auth: {
    headers: {
        Authorization: JWTtoken
      }
    }
});

JWTtoken로그인 후 JWT에서 토큰을 받습니다.

Broadcast Service Provider는 다음과 같습니다.

config/app.php에서 코멘트를 하지 않았습니다.

class BroadcastServiceProvider extends ServiceProvider
{
    public function boot()
     {
       Broadcast::routes(['middleware' => 'jwt.auth']);
       require base_path('routes/channels.php');
     }
}

My Channels.php 파일은 다음과 같습니다.

Broadcast::channel('App.User.{id}', function ($user, $id) {
    return (int) $user->id === (int) $id;
});

또한 어플리케이션 전체가 jwt에서 유일한 인증방식으로 동작하는 것을 확인했습니다.

config/auth.displaces

UserEvent라는 이름의 My Event는 다음과 같습니다.

class UserEvent implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;
    public $user;

    public function __construct(User $user)
    {
       $this->user = $user;
    }

    public function broadcastAs()
    {
       return 'themechanged';
    }

    public function broadcastOn()
    {
        return new PrivateChannel('App.User.'.$this->user->id);
    }
 }

그 후 vue 컴포넌트에서는 다음과 같이 했습니다.

 Echo.private('App.User.1')
 .notification('themechanged', (data) => {
     console.log(data)
  })

콘솔에 다음 오류가 나타납니다.broadcasting/auth 401 (Unauthorized)

언급URL : https://stackoverflow.com/questions/55920283/how-to-fix-broadcasting-auth-401-unauthorized-error-in-laravel-5-7-when-usi