简单16步搞定Laravel Echo的使用

简单16步搞定Laravel Echo的使用

先飚几句英文,说说 laravel echo 的作用:

One of my favorite projects in the Laravel ecosystem is Echo. Echo enables real-time web applications through the use of WebSockets and hooks directly into Laravel’s event broadcasting features. This means developers can use a familiar PHP API to send real-time data. A very common use-case for this type of functionality would be a notification or chat system.翻译「略」摘自:https://www.imarc.com/blog/realtime-notifications-with-laravel-echo-server-docker-and-traefik

官方文档推荐使用 Pusher 或者 laravel-echo-server (是一个使用 NodeJS + Socket.IO 实现的 WebSocket 服务端)。

推荐:laravel教程

在国内,个人还是不推荐使用 Pusher,访问速度有所影响,而且其还是一个商业产品。

今天利用最简便的「16」步,走一遍代码集成 laradock 和 laravel-echo-server 来使用 Laravel Echo。

搭建基础环境

// 1. new projectlaravel new echolearning// 2. 使用 laradockgit clone https://github.com/Laradock/laradock.git// 3. 创建 .envcp env-example .env// 4. 创建 containerdocker-compose up -d php-worker laravel-echo-server nginx redis

c6bbf4009a87c4aef48a01119e20199.png

// 5. 进入 workspace 容器docker-compose exec --user=laradock workspace bash// 6. 安装插件// 6.1 推荐使用 laravel-china 维护的 composer 国内镜像composer config -g repo.packagist composer https://packagist.laravel-china.org// 6.2 并行下载插件composer global require "hirak/prestissimo"// 6.3 配置 yarn 国内镜像yarn config set registry 'https://registry.npm.taobao.org'// 注:以上可以在 laradock 中配置// 6.4 执行安装composer installyarn install// 7. 创建 .env 和 keycp .env.example .envphp artisan key:generate

好了,我们开始在浏览器输入:http://localhost,网站跑起来了

8c3d6beef9cc1a433be3138f01f28f8.png

使用 Laravel Echo Server

因为 laradock 集成了「Laravel Echo Server」,所以我们很方便的使用到 Laravel Echo。

// 8. 配置广播驱动和 redis 服务器BROADCAST_DRIVER=redisREDIS_HOST=redis// 9. 安装 prediscomposer require predis/predis

准备好后端配置后,我们开始安装前端插件,毕竟 Laravel Echo 是前端工具。

// 10. 安装 socket.io-client laravel-echoyarn add socket.io-client laravel-echo

在 resources/assets/js/bootstrap.js 实例化 Echo:

// 11. 实例化 Echoimport Echo from 'laravel-echo'window.io = require('socket.io-client')window.Echo = new Echo({    broadcaster: 'socket.io',    host: window.location.hostname + ':6001'});// Laravel 官方推荐使用 pusher// window.Pusher = require('pusher-js');// window.Echo = new Echo({//     broadcaster: 'pusher',//     key: process.env.MIX_PUSHER_APP_KEY,//     cluster: process.env.MIX_PUSHER_APP_CLUSTER,//     encrypted: true// });

接下来我们就可以使用 Echo 实例,监听后端发过来的广播或者通知了。

首先我们利用已经给的 ExampleComponent 改造下,创建 Echo 监听,等待数据的到来,然后再显示在页面上。代码简单:

    
Example Component
  • {{ name }}
export default { data () { return { names: [] } }, mounted() { let that = this // 12. 创建 Echo 监听 Echo.channel('rss') .listen('RssCreatedEvent', (e) => { that.names.push(e.name) }); } }

我们在后端添加一个 rss 被创建的事件 RssCreatedEvent,并继承 ShouldBroadcast。

// 13. 创建 RssCreatedEvent 事件php artisan make:event RssCreatedEvent

我们使用假数据,让它返回当前的时间,方便查看效果:

 Carbon::now()->toDateTimeString()];    }}

然后我们就可以做一个定时任务了,让它每隔一分钟,广播一次:

简单AI 简单AI

搜狐推出的AI图片生成社区

简单AI 307 查看详情 简单AI

protected function schedule(Schedule $schedule){    // 15. 每隔一分钟执行一次    $schedule->call(function () {        event(new RssCreatedEvent());    })->everyMinute();}

最后让首页加载 vue 组件,刷新测试:

getLocale() }}">                                            Laravel            

注:需要在 header 引入


编译前端:

// 16. 运行 watchyarn run watch-poll

刷新网页,查看运行效果:

38ca55b8ef7d0f989dea50580d4d146.png

如我们所愿,每隔一分钟,广播一次,前端 laravel-echo 监听并捕获该广播,然后读取数据,展示出来。

总结

到目前为止,我们用到的技术都有:

1.laradock 的使用

2.laravel echo server 的使用

3.广播事件

4.event() 辅助函数

5.$schedule 定时任务

6.Laravel Echo 的使用

我们基本可以使用 Laravel Echo 了,至于更深入的使用,推荐查看官网文档。

最后再一次强烈推荐大家用 laradock 来部署 Docker 开发环境,因为你想要用到的工具和环境,相信 laradock 都为你准备好了。

以上就是简单16步搞定Laravel Echo的使用的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/491993.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
初探jQuery的主要功能和使用方法
上一篇 2025年11月8日 16:11:30
如何利用getconf优化Debian系统性能
下一篇 2025年11月8日 16:11:37

相关推荐

  • composer require-dev和require有什么不同_Composer Require与Require-Dev区别解析

    require用于声明项目运行必需的依赖,如框架、数据库组件和第三方SDK,这些包会随项目部署到生产环境;2. require-dev用于声明仅在开发和测试阶段需要的工具,如PHPUnit、PHPStan、Faker等,不会默认部署到生产环境;3. 安装时composer install根据环境决定…

    2026年5月10日
    900
  • 开源免费PHP工具 PHP开发效率提升利器

    推荐开源免费PHP开发工具以提升效率:VS Code、Sublime Text轻量高效,PhpStorm专业强大;调试用Xdebug、Kint、Ray;依赖管理选Composer;代码质量工具包括PHPStan、Psalm、PHP_CodeSniffer;数据库管理可用%ignore_a_1%MyA…

    2026年5月10日
    000
  • 深入理解 Laravel Session::put:避免常见陷阱与实现表单限流

    本文旨在深入探讨 laravel 框架中 `session::put` 方法的正确用法及其常见误区。针对用户在实现表单提交限流时遇到的问题,详细阐述了 `session::put` 必须提供键值对的原理,并提供了如何在控制器中利用会话机制有效防止重复提交的实战代码示例。通过本文,读者将掌握 lara…

    2026年5月10日
    000
  • Voyager 中关联关系的翻译问题解决方案

    本文档旨在解决在使用 TCGVoyager 管理后台时,关联模型无法正确翻译的问题。主要针对 Laravel 项目中,使用 Voyager 1.4 版本以及 Laravel 8.0 版本,并且已经配置多语言支持的情况下,如何确保关联关系中的可翻译字段能够根据当前应用语言环境进行正确翻译。通过修改 B…

    2026年5月10日
    000
  • 优化 Laravel Eloquent 查询:高效构建用户排行榜数据

    本教程详细讲解如何优化 Laravel Eloquent 查询以高效生成基于关联记录计数的排行榜。通过识别并消除冗余的 whereHas 子句,并巧妙利用 withCount 的条件闭包,我们能显著提升查询性能,大幅缩短数据获取时间,从而改善用户体验并降低数据库负载。 在 laravel 应用开发中…

    2026年5月10日
    000
  • 告别重复:使用Laravel Precognition统一前后端API验证

    本文旨在解决在Laravel后端与前端API交互中,如何高效复用后端验证规则的挑战。传统方案常限于表单元素,难以覆盖所有API请求。通过引入Laravel Precognition,开发者能够实现后端验证逻辑在前端的无缝应用,避免规则重复编写,从而提升开发效率与代码一致性,确保所有API请求的数据完…

    2026年5月10日
    200
  • Laravel Session::put 正确用法详解与常见误区规避

    本文详细探讨了 laravel 中 `session::put` 方法的正确用法,特别指出在仅提供键名而未指定值时可能导致会话数据未被正确设置的问题。通过示例代码,阐述了如何为会话数据赋予明确的值,并演示了如何正确地检查和获取会话数据,以确保会话管理功能按预期工作,有效避免常见的会话操作错误。 La…

    2026年5月10日
    000
  • PHP中批量为嵌套数组元素添加公共属性的教程

    本教程将详细介绍在php中如何高效地为包含多个关联数组的集合中的每个子数组添加一个或多个新的公共键值对。我们将探讨使用循环和数组合并函数实现这一目标的方法,并提供清晰的代码示例,帮助开发者处理此类数据结构转换。 在PHP开发中,我们经常会遇到处理复杂数据结构的需求,其中一种常见场景是拥有一个由多个关…

    2026年5月10日
    000
  • PHP框架的社区支持存在哪些痛点?

    php框架社区支持的痛点包括:文档匮乏或过时(1)、响应缓慢(2)、社区分散(3)。实战案例表明这些痛点可能导致开发进度受阻。改善方法包括:提供全面的文档、建立响应迅速的官方论坛、创建一个集成的社区平台。 PHP 框架社区支持存在的痛点及实战案例 PHP 框架为 Web 开发提供了强大的基础,但其社…

    2026年5月10日
    100
  • Laravel 8中Firebase Storage文件条件删除策略与实践

    本文针对Laravel 8环境下Firebase Storage无法直接按目录批量或条件删除文件的限制,提出了一套基于元数据管理的解决方案。通过在数据库中记录文件信息,结合Laravel的Artisan命令和Cron任务,实现对过期文件的精准识别与逐个删除,确保存储资源的有效管理。 Firebase…

    2026年5月10日
    000
  • php怎么安装_在云服务器上部署PHP环境的步骤

    答案:在云服务器上部署PHP环境需搭建LEMP栈(Linux+Nginx+MySQL+PHP-FPM),依次更新系统、安装Nginx、MariaDB、PHP-FPM及扩展,配置Nginx解析PHP并测试,最后通过权限控制、安全配置、防火墙和HTTPS等措施保障环境安全稳定。 在云服务器上部署PHP环…

    2026年5月10日
    000
  • Laravel 产品多图上传错误:foreach() 参数类型问题解决方案

    本文旨在解决 Laravel 应用中产品多图上传时遇到的 “foreach() argument must be of type array|object, null given” 错误。通过检查并确保循环遍历的变量为数组类型,避免因空值导致的错误,并提供代码示例和注意事项,…

    2026年5月10日
    200
  • PHP源码命令行工具开发_PHP源码命令行工具开发教程

    答案是使用PHP开发命令行工具需依托CLI SAPI,结合Composer管理依赖,并推荐采用Symfony Console等组件库来构建。首先确保PHP支持CLI模式,通过编写基础脚本并利用$argv和getopt()处理参数,但更优方式是引入Symfony Console组件进行命令定义与输入输…

    2026年5月10日
    000
  • PHP怎么运行创建_php脚本创建与执行流程解析

    PHP脚本需在服务器环境中通过解释器运行,不能双击执行。首先搭建环境(如XAMPP),然后编写.php文件并保存至服务器根目录,接着通过浏览器访问或命令行执行php命令运行脚本,服务器会调用PHP解释器解析代码并返回结果。 PHP脚本的运行依赖于服务器环境和解释器,不是直接像可执行程序那样双击运行。…

    2026年5月10日
    100
  • php中get_parent_class获取父类名_php在继承链中定位父类的应用场景

    get_parent_class函数用于获取类的父类名称,接收类名字符串返回父类名或false。示例中Dog类继承Animal,调用get_parent_class(__CLASS__)输出Animal。应用场景一:条件性调用父类方法,如构造函数中判断是否存在父类并调用其方法,提升灵活性。应用场景二…

    2026年5月10日
    100
  • 使用Laravel Blade动态渲染带标题的表格数据

    本文旨在详细指导如何在Laravel Blade模板中,利用`@foreach`循环和正确的索引策略,高效且准确地从嵌套数组结构中提取数据,并将其渲染成一个结构清晰、内容匹配的HTML表格,避免数据重复和错位问题。 在Web开发中,经常需要根据后端提供的数据动态生成HTML表格。特别是在处理具有行标…

    2026年5月10日
    000
  • Laravel模型中实现多语言数据自动过滤:重写newQuery()方法

    本教程详细介绍在laravel多语言应用中,如何通过重写模型(model)的`newquery()`方法,实现数据查询时自动根据当前应用语言环境进行过滤。这种方法提供了一种优雅且dry(don’t repeat yourself)的解决方案,避免了在每次数据查询时手动添加语言条件,确保了…

    2026年5月10日
    000
  • php学习有哪些

    PHP 学习途径:入门途径:在线教程:Codecademy、Udemy、Coursera 等书籍:《Head First PHP & MySQL》、《PHP in Action》官方文档:PHP 官方文档进阶学习:框架:Laravel、CodeIgniter 等数据库:MySQL、Postg…

    2026年5月10日
    100
  • 在 Laravel 中同时存储原始图片和 WebP 转换图片

    本文详细介绍了在 Laravel 应用中如何高效地处理图片上传,实现同时保存原始图片(如 JPG/PNG)及其 WebP 转换版本。通过利用 PHP 原生 GD 库功能,我们能够克服 Intervention Image 在特定场景下的路径写入问题,确保原始图片和优化后的 WebP 格式文件都能正确…

    2026年5月10日
    000
  • 解决AJAX响应中PHP输出JSON后出现多余HTML的问题

    本文旨在解决PHP脚本通过AJAX响应返回JSON数据时,出现JSON数据后方意外附带HTML内容的问题。通过在PHP脚本中JSON编码输出后立即使用die()或exit()函数,可以有效阻止后续不必要的输出,确保客户端接收到纯净、可解析的JSON响应,从而避免解析错误,提升前后端通信的健壮性。 理…

    2026年5月10日
    000

发表回复

登录后才能评论
关注微信