how to change pusher host to connect to /broadcasting/auth on a different domain?

[vesper8]

My vue site is https://www.xxx.com
and my Laravel api is https://api.xxx.com

I use Laravel Echo with Pusher and it always wants to use https://www.xxx.com/broadcasting/auth to join my channels.

I need it to be https://api.xxx.com/broadcasting/auth

I have jwt.auth and cors working correctly already, but no matter what I do, setting the host, wsHost or httpHost, it doesn't respect my setting. It ignores it completely if I change the 'host' and if I set the wsHost/httpHost it then tries to connect to a /pusher/app url with lots of url parameters and doesn't try to connect to /broadcasting/auth anymore

It was working fine when both the laravel backend and vue front-end was on the same domain.. but now that I decoupled them I can't get it to change the host

I'm really stuck here.. some help would be so appreciated!

[vesper8]

I think this must be a bug because after I did

console.log(window.Echo.connector.pusher.config.host);

It does show my custom host.. yet it ignores that host and uses the current domain instead

Finally I found a way to force it to use the domain I want by doing this:

window.Echo.connector.pusher.config.authEndpoint = `https://api.xxx.com/broadcasting/auth`;

[morloderex]

When you instantiate echo you can pass in authEndpoint to it.

It looks like every configuration is passed down towards the underlaying Pusher configuration instance.

PusherConnector Constructor.

echo/src/connector/pusher-connector.ts

Line 33 in bf93673

this.pusher = new Pusher(this.options.key, this.options);

Echo constructor.

echo/src/echo.ts

Line 45 in bf93673

this.connector = new PusherConnector(this.options);

Here is a list of possible Pusher specific configuration keys:
https://github.com/pusher/pusher-js#configuration

So just do it that way. :)

[driesvints]

Can you try @morloderex's solution to see if that works?

[lukasz-madon]

just add it to the config

    window.Echo = new Echo({
      broadcaster: 'pusher',
      authEndpoint: `https://xxxx/broadcasting/auth`,
      cluster: 'us3',
      forceTLS: true,
      auth: {
        headers: {
          Authorization: 'Bearer ' + jwt
        },
      },
    });

[parallels999]

@lukasz-madon on next version you can use bearerToken option

window.Echo = new Echo({
  broadcaster: 'pusher',
  authEndpoint: `https://xxxx/broadcasting/auth`,
  cluster: 'us3',
  forceTLS: true,
  bearerToken: jwt,
  /*auth: {
    headers: {
      Authorization: 'Bearer ' + jwt
    },
  },*/
});

[EnzoPV25]

I'm still having this issue, even by using direclty authEndPoint, it doesn't affect my configuration at all, anything on this has been updated ? I can't make it work on different domains.