laravel-5.4 - 在没有 Vue.js 的情况下使用 Laravel Echo

Question

我有一个使用 Laravel 5.4 构建的网站，我正在使用 Laravel Echo 和 Pusher 构建广播系统，但不幸的是，文档缺少指定在没有 Vue.js 的情况下使其工作所需的步骤。

有人使用此配置吗？我需要一个完整的分步指南，因为正确安装了 Echo(我更喜欢 CDN，但找不到)。

Answer 1

最后，我自己弄清楚了如何使用 Pusher 但不使用 Vue.js 来实现 Laravel Echo

1. 按照找到的所有说明here .

2. 假设你已经安装并配置了 Pusher，并通过 npm 安装了 Laravel Echo，请转到 your-project-folder/node_modules/laravel-echo/dist并复制echo.js在你的 Laravel 公用文件夹中(例如 your-project-folder/public/lib/js )。我使用 Grunt，所以我自动化了这个过程，只是为了简单起见。

3. 在 Blade 模板中添加引用:

   <script type="text/javascript" src="{{asset('lib/js/echo.js')}}"></script>

4. 在你的 Blade 模板的开头，在下面标记的地方，插入这行代码(只是为了避免直接使用 echo.js 出现 JS 错误):

   <script>
       window.Laravel = <?php echo json_encode([
           'csrfToken' => csrf_token(),
       ]); ?>;
       var module = { }; /*   <-----THIS LINE */
   </script>
   

5. 在你的页脚中，在包含所有 JS 文件之后，这样调用 Laravel Echo:

   <script>
       window.Echo = new Echo({
           broadcaster: 'pusher',
           key: '{{env("PUSHER_KEY")}}',
           cluster: 'eu',
           encrypted: true,
           authEndpoint: '{{env("APP_URL")}}/broadcasting/auth'
       });
   </script>
   

6. 如果你想收听一个 channel ，例如通知之一，你可以这样做:

   <script>
       window.Echo.private('App.User.{{Auth::user()->id}}')
           .notification((notification) => {
               doSomeAmazingStuff();
       });
   </script>