demo：
http://www.200ok.fun:8083/api/chat/list

前言：
这个种方式太耗redis连接数，每次订阅都会新起一个进程，仅供练手使用，切勿用于生产环境。

原理：
1.PHP提供两个接口，订阅，发布，redis就有提供
2.订阅接口会卡住，不会马上response，直至有发布的消息
3.前端需要在一次订阅请求成功或失败后立即重新发一个订阅请求，以免错漏信息

后台代码(用的laravel框架，只要能调用redis，实现一致即可)：

// 订阅接口public function subscribe(Request $request)
{Redis::subscribe([self::CHATROOMCHANNEL], function ($message) {echo json_encode($this->rtnSucc($message));exit;});
}
// 发布接口
public function publish(Request $request)
{$num = Redis::publish(self::CHATROOMCHANNEL, $request->input('say', '对方没有说话'));if ($num) {return $this->rtnSucc($num);} else {return $this->rtnErr(100, "发送失败");}
}private function rtnSucc($data)
{return ["rtn" => 0, "msg" => "", "data" => $data];
}private function rtnErr($rtn, $msg = "")
{return ["rtn" => $rtn, "msg" => $msg, "data" => ""];
}

前端代码：

<!DOCTYPE html>
<html lang="zh">
<head><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>200OK ChatRoom</title><style>body {margin: 0;padding: 0;}#input_box {width: 92%;height: 100px;margin: 0 auto;display: block;border-radius: 2px;}#btn {height: 30px;text-align: center;font-size: 16px;background-color: #E91E63;color: #fff;margin: 10px 10px 0 10px;border-radius: 2px;line-height: 30px;}#content {margin: 0 10px;font-size: 16px;color: #795548;}</style>
</head>
<body><div id="content"><p>200 OK ChatRoom!</p>
</div>
<textarea id="input_box" placeholder="输入你想说的话"></textarea>
<div id="btn">发射！</div>
<script src="/js/zepto.js"></script>
<script src="/js/md5.min.js"></script>
<script>// dom
    let $input_box = $("#input_box");let $content = $("#content");let $btn = $("#btn");let myName = getRandomName();main();// 入口function main() {bindEvent();subscribe();$content.append(pp("你叫：" + myName));}// 监听事件function bindEvent() {$btn.on("click", function () {say();});$input_box.bind('keyup', function (e) {if (13 === e.keyCode) {say();}});}// 说function say() {var str = getC().trim();if (!str) {error("请输入内容");return;}publish(namePrefix() + str, function (rp) {$input_box.val("");$input_box.focus();});}// 获取输入框内容function getC() {return $input_box.val();}// 订阅 回调之后继续订阅function subscribe(callback) {$.ajax({type: 'GET',url: '/api/chat/subscribe',data: {},dataType: 'json',timeout: 10000,success: function (data) {if (0 === data.rtn) {$content.append(pp(data.data));}subscribe();},error: function (xhr, type) {// 防止雪崩
                setTimeout(function () {subscribe();}, 1000);}});}// 发布function publish(str, callback) {$.get('/api/chat/publish?say=' + str, function (response) {callback(response);});}function pp(str) {return "<p>" + str + "</p>"}function namePrefix() {return myName + ": ";}// 错误处理function error(str) {alert(str);}// 生成随机姓名function getRandomName() {var familyNames = new Array("赵", "钱", "孙", "李", "周", "吴", "郑", "王", "冯", "陈","褚", "卫", "蒋", "沈", "韩", "杨", "朱", "秦", "尤", "许","何", "吕", "施", "张", "孔", "曹", "严", "华", "金", "魏","陶", "姜", "戚", "谢", "邹", "喻", "柏", "水", "窦", "章","云", "苏", "潘", "葛", "奚", "范", "彭", "郎", "鲁", "韦","昌", "马", "苗", "凤", "花", "方", "俞", "任", "袁", "柳","酆", "鲍", "史", "唐", "费", "廉", "岑", "薛", "雷", "贺","倪", "汤", "滕", "殷", "罗", "毕", "郝", "邬", "安", "常","乐", "于", "时", "傅", "皮", "卞", "齐", "康", "伍", "余","元", "卜", "顾", "孟", "平", "黄", "和", "穆", "萧", "尹");var givenNames = new Array("子璇", "淼", "国栋", "夫子", "瑞堂", "甜", "敏", "尚", "国贤", "贺祥", "晨涛","昊轩", "易轩", "益辰", "益帆", "益冉", "瑾春", "瑾昆", "春齐", "杨", "文昊","东东", "雄霖", "浩晨", "熙涵", "溶溶", "冰枫", "欣欣", "宜豪", "欣慧", "建政","美欣", "淑慧", "文轩", "文杰", "欣源", "忠林", "榕润", "欣汝", "慧嘉", "新建","建林", "亦菲", "林", "冰洁", "佳欣", "涵涵", "禹辰", "淳美", "泽惠", "伟洋","涵越", "润丽", "翔", "淑华", "晶莹", "凌晶", "苒溪", "雨涵", "嘉怡", "佳毅","子辰", "佳琪", "紫轩", "瑞辰", "昕蕊", "萌", "明远", "欣宜", "泽远", "欣怡","佳怡", "佳惠", "晨茜", "晨璐", "运昊", "汝鑫", "淑君", "晶滢", "润莎", "榕汕","佳钰", "佳玉", "晓庆", "一鸣", "语晨", "添池", "添昊", "雨泽", "雅晗", "雅涵","清妍", "诗悦", "嘉乐", "晨涵", "天赫", "玥傲", "佳昊", "天昊", "萌萌", "若萌");var i = parseInt(10 * Math.random()) * 10 + parseInt(10 * Math.random());var familyName = familyNames[i];var j = parseInt(10 * Math.random()) * 10 + parseInt(10 * Math.random());var givenName = givenNames[i];return familyName + givenName;}
</script>
</body>
</html>

转载于:https://www.cnblogs.com/lzs-888/p/10382339.html

PHP 简易聊天室 利用redis的订阅发布功能相关推荐

  1. Java实现Redis的订阅发布功能，亲测可以

    文章目录 简介 Redis发布订阅 Java发布订阅 简介 首先我们得知道,当一个用户订阅了某个频道,那么他就会一直在那监听该频道是否发出消息,是一种阻塞的状态,所以,我们把订阅功能用多线程来实现,给 ...

  2. Redis的订阅发布功能对比RabbitMQ消息队列

    1.对比 特性 redis RabbitMQ 可靠性 没有相应的机制保证消息的可靠消费,如果发布者发布一条消息,而没有对应的订阅者的话,这条消息将丢失,不会存在内存中 具有消息消费确认机制,如果发布一 ...

  3. Express+Socket.IO 实现简易聊天室

    代码地址如下: http://www.demodashi.com/demo/12477.html 闲暇之余研究了一下 Socket.io,搭建了一个简易版的聊天室,如有不对之处还望指正,先上效果图: ...

  4. 连夜撸了一个简易聊天室

    点击上方蓝色"方志朋",选择"设为星标" 回复"666"获取独家整理的学习资料! 分不清轮询.长轮询?不知道什么时候该用websocket还 ...

  5. 撸一个简易聊天室，不信你学不会实时消息推送（附源码）

    点击上方 好好学java ,选择 星标 公众号重磅资讯,干货,第一时间送达 今日推荐:推荐 19 个 github 超牛逼项目!个人原创100W +访问量博客:点击前往,查看更多 分不清轮询.长轮询? ...

  6. 基于Node.js + WebSocket 的简易聊天室

    代码地址如下: http://www.demodashi.com/demo/13282.html Node.js聊天室运行说明 Node.js的本质就是运行在服务端的JavaScript.Node.j ...

  7. 使用 Redis 实现语音社交聊天室源码中的排行榜功能

    在语音社交聊天室源码中,排行榜功能是一个很普遍的需求.使用 Redis 中有序集合的特性来实现排行榜是又好又快的选择. 一般语音社交聊天室源码的排行榜都是有实效性的,比如"用户积分榜&quo ...

  8. vue php聊天室,Laravel + Swoole 打造IM简易聊天室

    Laravel + Swoole 打造IM简易聊天室 最近在学习Swoole,利用Swoole扩展让PHP生动了不少,本篇就来Swoole开发一款简易的IM聊天室 应用场景:实现简单的即时消息聊天室. ...

  9. express+socket简易聊天室

    文章目录 简易聊天室 前置知识 这里使用socket.io实现 前端设置 前端代码 后端代码 效果图 娱乐一刻 简易聊天室 前置知识 在我们平常的时候,ajax发送的都是短连接,get完成或者post ...

最新文章

  1. 如何用Python快速抓取Google搜索？
  2. poj1548 Robots
  3. spring缓存_有关Spring缓存性能的更多信息
  4. 好看的粉色树洞表白墙网站源码
  5. Vivado生成bit文件报错彻底解决
  6. HDU 1532 Drainage Ditches(poj1273)【E-K 最大流】
  7. php的基本语法与字符串与增删改查
  8. 常见的大数据术语表（中英对照）
  9. VS2015 无法启动IIS Express Web服务器
  10. 地图比例尺、瓦片切片方案、EPSG
  11. OpenCV threshold函数详解
  12. 企业内部知识共享平台的好处-以Confluence为例
  13. Python语言程序设计课程论文--飞机大战
  14. Mixpanel 可视化ABTest分析 —— iOS篇
  15. python怎么用圆周率_用python程序求圆周率到任意位
  16. Word图片保存后失真（变模糊）解决方法
  17. 百度云下载神器再升级！
  18. 骨传导耳机排名前十名，列举排行靠前的几款骨感耳机
  19. landlord攻略_全攻略：在卡尔加里如何当好房东-之（三）合同篇
  20. fffffffffffffffffffffffffffffffff

热门文章

  1. 【网络安全常用术语解读】CPE详解
  2. 红黑树·删除操作，详细图解
  3. ecs共享型s6怎么样？
  4. 怎么把path里oracle地址删掉,path路径删除了怎么办
  5. 一首关于桃花与桃花仙的故事
  6. rx7900xt和gtx3090ti差距 rx7900xt和gtx3090ti哪个好
  7. 面临“反对沉没成本”效应，海尔、格力、海信、美的等家电厂商的智能音箱还有必要做吗？
  8. 红牛农场java代码_Java面向对象程序设计实验指导模板代码（171页）-原创力文档...
  9. 太极定二仪，清浊始以形：红黑树的实现和性质
  10. 链表的两种创建方法——头插法与尾插法