Laravel学习笔记 广播

1. composer require predis/predis
2. 设置.env文件，修改广播驱动BROADCAST_DRIVER=redis
3. 设置.env文件，修改QUEUE_DRIVER=redis（使用到了redis队列）
4. 开启 config/app.php App\Providers\BroadcastServiceProvider::class
5. 生成eventartisan make:event
6. 在事件中实现ShouldBroadcast接口，implements ShouldBroadcast
7. 编辑广播内容以及频道

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

    /**
     * Get the channels the event should broadcast on.
     *
     * @return \Illuminate\Broadcasting\Channel|array
     */
    public function broadcastOn()
    {
        return new PrivateChannel('test_chat');
    }

6. 安装Socket.io客户端，使其与redis广播配对，cnpm install --save socket.io-client
7. 安装laravel-echo-server（因为Laravel 官方并没有内置 Socket.IO 服务器实现；不过，可以选择一个由社区驱动维护的项目 tlaverdure/laravel-echo-server ） cnpm install -g laravel-echo-server
   （不知道为什么，用npm会安装其他鬼东西，所以请用cnpm）

npm install --save socket.io-client |  echo 'websocket 客户端'
npm install --save laravel-echo     |  echo 'websocket 客户端封装'
npm install -g laravel-echo-server  |  echo 'websocket 服务端'
npm install                         |  echo '安装所有其他依赖'
npm run watch                        |  echo '监控文件变化编译前端资源'
laravel-echo-server init             |  echo '初始化 websocket 服务端'
laravel-echo-server start            |  echo '启动 websocket 服务端'

9. 如果laravel安装在虚拟机上的话，需要在.env中追加以下内容

// 因为redis安装在homestead是，所以是192.168.10.10
LARAVEL_ECHO_SERVER_REDIS_HOST=192.168.10.10
// LARAVEL_ECHO_SERVER_REDIS_PASSWORD=
LARAVEL_ECHO_SERVER_REDIS_PORT=6379

10. 配置客户端 resources/js/bootstrap.js

import Echo from "laravel-echo"

window.io = require('socket.io-client');

window.Echo = new Echo({
    broadcaster: 'socket.io',
    host: window.location.hostname + ':6001'
});

11. 设置客户端监听广播

window.Echo.channel('countryside')
    .listen('Free', (e) => {
        console.log(e);
    });

12. 启动 Laravel Queue Worker

$ php artisan queue:work

13. 启动 Laravel-echo-server

$ laravel-echo-server start

14. 在这个过程中遇到了这样一个问题

登陆网站后，控制台疯狂跳503错误，表示跨域问题

研究了一天多后发现是laravel-echo-server的配置问题（真坑）。。。而不是所谓的跨域问题（其实有503报错，但是注意力被跨域错误吸引了）
因为是使用homestead搭载服务器的，homestead上的代码映射到本地文件夹，
而本地使用phpstorm关联本地的文件夹里的项目进行开发。
在phpstorm执行laravel-echo-server start后，其关联的是本地域名服务器127.0.0.1:6001

而并非homestead上的服务器

但是前台请求的时候请求的是host: window.location.hostname + ':6001'，即当前域名 www.mushishi.com：6001（这个域名是挂载在虚拟机上的，也就是 192.168.10.100:6001）

导致请求地址和laravel-echo-server服务器的地址对不上，从而出现了503问题

解决方法有两个：

• 如上图，将请求地址改为localhost（但是这种只是临时用的，只能用于本地测试，生产环境百分百出问题）
• 老老实实的把laravel-echo-server安装到homestead上，并在homestead上启动

参考文章

https://blog.csdn.net/nsrainbow/article/details/80428769

15. 很关键，别漏了！！否则会报找不到channel的错误