问下 Laravel 广播系统，是不是要用 Vue 模板，blade 是怎么弄的？

我已经安装了laravel-echo-server 也start起来了，然后queue_connection 设置成redis了，
然后我创建了一个事件，

public function broadcastOn()
{
        return new Channel('blog'.$this->users->id);
}

发布一个广播，然后在一个页面比如hello.blade.php页面

然后查看console那一栏，发现提示 Uncaught ReferenceError: Echo is not defined ，我已经在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'
});

donggan

323 声望

暂无个人描述~

0 人点赞

从零开发一个电商项目，功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等

从零开始带你一步步开发一个 Go 博客项目，让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。

推荐文章：

更多推荐...

博客

用 Laravel12 Startkit 做了一个 composer 私有包托管平台 😂 点赞超过 20 个开源，看看需要的人多不多 28 / 19 |

如何打造令后端面试官印象深刻的简历？ 16 / 10 |

博客

花了四个月打磨的 Laravel Plus 开源 30 / 98 |

博客

冯老师的困惑 —— 一个跑了两年的 BUG 21 / 17 |

博客

在laravel下实现全双工的websocket开发 21 / 8 |

分享创造

无需修改任何代码和扩展将你的Laravel项目性能提高20倍 101 / 100 |

讨论数量: 4

pingfan

464 声望

babel 不能用 import 吧，你应该用 script 引入 laravel-echo 和 socket.io-client

5年前评论

donggan （楼主）

恩恩是的，提示未定义，问下引入怎么引入的？

pingfan

464 声望

@donggan 你可以找一下有没有cdn，没有的话你可以把 laravel-echo 项目 clone 下来，然后执行 npm run build 命令构建项目，构建完成后把 dist 目录下的文件 copy 到你项目下，最后用 script 引入即可

socket.io-client 可以启动 laravel-echo-server 服务，然后这么引入

<script src="//127.0.0.1:6001/socket.io/socket.io.js"></script>

5年前评论

donggan （楼主）

谢谢，我发现要引入这个，需要在服务器端运行laravel-echo-server 监听6001端口，但是为什么，我在blade文件显示还是Echo未定义呢？

donggan （楼主）

我在引入这个文件后，script里面加入这些代码，Echo.chanel('laravel_database_blog1').listen('blog', (e) => { console.log(788); });

pingfan （作者）

@donggan Echo 和 socket.io 都需要单独引入

donggan （楼主）

@yanthink 那这个Echo怎么引入的呢？

pingfan （作者）

@donggan 把 laravel-echo 项目 clone 下来，然后执行 npm i && npm run build 命令构建项目，构建完成后把 dist/echo.iife.js 文件 copy 到你项目下（比如 public/js/），最后 <script src="{{asset('js/echo.iife.js')}}"></script> 引入即可

pingfan （作者）

@donggan 我临时构建了 echo.iife.js 文件，你可以直接下载来用

pingfan

464 声望

@donggan

file

Laravel

5年前评论

donggan （楼主）

我再问下，比如我在一个事件文件如NewBlogView里面，这个类实现implements ShouldBroadcastNow，加入public function broadcastOn() { return new Channel('blog'); }，我在一个blade页面加入 window.Echo = new Echo({ broadcaster: 'socket.io', host: window.location.hostname + ':6001' }); Echo.channel('blog').listen('NewBlogView', (e) => { console.log(788); });已经引入你给的文件了，谢谢啊，为什么引起了事件后，这个前台还是没有收到广播呢？

pingfan （作者）

@donggan 广播需要在你服务端触发的啊

pingfan （作者）

@donggan 你服务端触发 NewBlogView 事件就可以收到了

donggan （楼主）

关键是我在后台的laravel-echo-server都能看到，Channel：laravel_database_blog,Event:blog，前台怎么就是接收不到呢？

donggan （楼主）

@yanthink 我是这样，添加了一条路由，路由连到一个控制器里面的方法，然后在那个方法里面进行触发事件的，而我测试的话就是开两个网页，一个是前台接收广播的页面，一个是那个路由的访问页面，触发事件，通过浏览器触发事件都不行的吗？

donggan （楼主）

我控制器里面方法，public function showGet($id) { $user = User::find($id); event(new NewBlogView($user)); }

pingfan （作者）

@donggan 事件的命名空间呢？

pingfan （作者）

@donggan 正常不是 Channel：blog, Event:App\Events\NewBlogView 这样的吗

pingfan （作者）

@donggan 可以触发，你把 redis 前缀设置成空应该就可以了

pingfan

464 声望

1、需要将 database.redis.options.prefix 配置设置为空，你的应该是 laravel_database_

redis 加前缀后广播 Channel 也会自动加前缀，这会导致前端和后端的 Channel 对不上

2、broadcast(new App\Events\NewBlogView) 触发广播事件

5年前评论

donggan （楼主）

你好，我看了下这个网址，https://blog.csdn.net/nsrainbow/article/details/80428769，里面有一个步骤是要Homestead.yaml里面添加6001 端口的映射 - send: 6001 to: 6001，是不是还要有这个映射？

donggan （楼主）

@yanthink 我后来测试了下，不需要在Homestead.ymal中开启端口映射，我现在前台可以收到channel了，但是现在有个问题，我laravel-echo-server 需要另外开启一个queue:listen,不然的话laravel-echo-server就收不到channel了，你也是需要同时开启laravel-echo-server 和queue:listen么？

pingfan （作者）

@donggan 不需要

pingfan （作者）

@donggan 你事件是不是 implements ShouldQueue 接口了

donggan （楼主）

@yanthink 是的，开始的时候没有实现，前台就没成功接收到

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容，与人为善，比聪明更重要！

帮助

问下 Laravel 广播系统，是不是要用 Vue 模板，blade 是怎么弄的？

推荐文章：

社区赞助商

关于 LearnKu

资源推荐

服务提供商

其他信息

问下 Laravel 广播系统，是不是要用 Vue 模板，blade 是怎么弄的？

推荐文章：

社区赞助商

关于 LearnKu

资源推荐

服务提供商

其他信息

请登录