Laravel 在 electron-vue 应用程序中回显 - join() 不工作

Question

我正在构建一个带有 electron-vue 和 laravel 后端的桌面应用程序。我在项目中设置 Laravel Echo 并使用 Echo.channel() 工作得很好。现在我尝试使用带有 Echo.join() 的状态通道，但它似乎什么也没做。我可以在推送器调试控制台中看到连接，但它从未加入频道。最奇怪的是它从来没有向我的服务器请求授权。

在我的 renderer/main.js 文件中，我创建了 Echo 实例：

window.Pusher = require('pusher-js')
window.Echo = new Echo({
  broadcaster: 'pusher',
  key: Keys.PUSHER_KEY,
  cluster: Keys.PUSHER_CLUSTER,
  forceTLS: true,
  authEndpoint: `${apiUrl}/broadcasting/auth`
})

if(localStorage.getItem('api_key')) {
  let key = localStorage.getItem('api_key')
  axios.defaults.headers.common['Authorization'] = 'Bearer ' + key
  window.Echo.connector.pusher.config.auth.headers['Authorization'] = 'Bearer ' + key
}

然后在我的组件中，我有以下代码来加入状态频道。显示来自 vuex，所以我从观察者触发它：

watch: {
  'display.id': {
    immediate: true,
    handler: function(newVal) {
      if(newVal) {
        this.joinPresenceChannel()
      }
    }
  }
},
methods: {
  joinPresenceChannel() {
    console.log(`joining presence channel: display.${this.display.id}`)
    Echo.join(`display.${this.display.id}`)
        .here((users) => {
          console.log('Users here: ')
          console.log(users)
        })
  }
}

console.log() 表示“加入状态频道”会触发，但 here() 方法中的 console.log() 永远不会触发。查看 chrome 中的网络选项卡，我可以看到它从不向 /broadcasting/auth.

发出请求

我也有后端所有设置来授权频道。实际上，我在 laravel 项目中有我的 inertiajs 应用程序，它使用相同的存在通道，具有相同的代码，并且它只是加入查找。我似乎无法让 Electron 应用程序正常工作。

谁能给我指出正确的方向？

Answer 1

看来我终于弄明白了。在做了更多调查之后，我发现 electron devtools 显然只是没有显示对授权路由的请求，因为我在我的 access_log 上做了一个 tail 并看到它实际上正在点击该路由。在访问日志中，我还可以看到我收到了 403 响应。

因为我需要我的 electron 应用程序和我的 inertia web 应用程序才能对这些通道进行身份验证，所以我将 BroadcastServiceProvider 启动方法更改为如下所示：

public function boot()
{
    Broadcast::routes(['middleware' => 'web']);
    Broadcast::routes(['prefix' => 'api', 'middleware' => ['api', 'auth:sanctum']]);

    require base_path('routes/channels.php');
}

我还发现除非在 API 路由上添加 auth:sanctum 中间件，否则它不会工作。您还必须确保更新客户端以使用 /api/broadcasting/auth 路由而不是默认的 /broadcasting/auth.

进行这些更改后，我似乎可以很好地加入状态频道了。

Laravel 在 electron-vue 应用程序中回显 - join() 不工作

Laravel echo in electron-vue app - join() not working

laravel

vue.js

electron

pusher

laravel-echo