服务端：

<?php
class Chat
{
    const HOST = '0.0.0.0';//ip地址 0.0.0.0代表接受所有ip的访问
    const PART = 8080;//端口号

    private $server = null;//单例存放websocket_server对象

    public $roles = [
        '郭靖','杨过','洪七公','尹志平','赵志敬','丘处机','欧阳锋','一灯大师','黄药师'
    ];

    public function __construct()
    {
        //实例化swoole_websocket_server并存储在我们Chat类中的属性上，达到单例的设计
        $this->server = new swoole_websocket_server(self::HOST, self::PART);
        //监听连接事件
        $this->server->on('open', [$this, 'onOpen']);
        //监听接收消息事件
        $this->server->on('message', [$this, 'onMessage']);
        //监听关闭事件
        $this->server->on('close', [$this, 'onClose']);
        //设置允许访问静态文件
        $this->server->set([
            'document_root' => '/www/chat1',//这里传入静态文件的目录
            'enable_static_handler' => true//允许访问静态文件
        ]);

        //开启服务
        $this->server->start();
    }

    /**
     * 连接成功回调函数
     * @param $server
     * @param $request
     */
    public function onOpen($server, $request)
    {
        echo $request->fd . '连接了' . PHP_EOL;//打印到我们终端
        $server->push($request->fd,json_encode(['no' => $request->fd, 'msg' =>'']));
    }

    /**
     * 接收到信息的回调函数
     * @param $server
     * @param $frame
     */
    public function onMessage($server, $frame)
    {
        $role = $this->getRole($frame->fd);
        echo $role. '来了，说：' . $frame->data . PHP_EOL;//打印到我们终端
        foreach ($server->connections as $fd) {//遍历TCP连接迭代器，拿到每个在线的客户端id
            //将客户端发来的消息，推送给所有用户，也可以叫广播给所有在线客户端
            $msg = $frame->data;
            $server->push($fd, json_encode(['no' => $frame->fd,'role'=>$role, 'msg' => $msg]));
        }
    }

    public function getRole($fd)
    {
        $roles = count($this->roles);
        $role = ($fd < $roles) ? $this->roles[$fd] : $this->roles[$fd%$roles];
        var_dump($role);
        return $role;
    }

    /**
     * 断开连接回调函数
     * @param $server
     * @param $fd
     */
    public function onClose($server, $fd)
    {
        echo $fd . '走了' . PHP_EOL;//打印到我们终端
    }

}

$obj = new Chat();

　　客户端

<!doctype html>

<html>

<head>

    <meta charset="utf-8">

    <title>聊天室</title>

    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>

</head>

<body>
<style>
    .right {
        color: blue;
        display:block;
        float:right;
        width:100%;
    }

</style>

<div style="width: 500px; margin:0 auto;">
    <div class="log" id='scrolldIV' style="height:500px;border: 2px solid #ccc;line-height: 1.5em;overflow:auto" >

        =======聊天室======

    </div>

    <!--<input type="button" value="连接" onClick="link()">-->
    <input type="hidden" value="" id="fd">
    <!--<input type="button" value="断开" onClick="dis()">-->

    <div >
        <input type="text" id="text">

        <input type="button" value="发送" onClick="send()" id="submit">
    </div>

</div>

<script>

    $(document).keydown(function(event){
        if(event.keyCode==13){
            $("#submit").click();
        }
    });

    $(function () {
        $("#text").focus();
        link();
    })

    function link() {

        var url = 'ws://192.168.33.60:8080';

        socket = new WebSocket(url);

        socket.onopen = function (evt) {
            log1('<div>连接成功</div>')
        }

        socket.onmessage = function (msg) {
            var data = $.parseJSON(msg.data)
            if(data.msg.length <= 0){
                $("#fd").val(data.no);
            } else {
                log(data);
            }
　　　　　　
　　　　　
　　　　　　　　var div = document.getElementById('scrolldIV');
　　　　　　　　div.scrollTop = div.scrollHeight;
        }

        socket.onclose = function () {
            log1('<div>断开连接</div>')
        }

    }

    function dis() {

        socket.close();

        socket = null;

    }

    function log1(data) {
        $('.log').append(data);
    }
    function log(data) {
        var nowFd = $("#fd").val();
        console.log(data);
        var role;
        if(data['no'] == nowFd){
            role ="我";
            $('.log').append("<div class='right'>" + role+":"+ data['msg'] + '</div>');
        } else {

            $('.log').append("<div >" + data.role+": "+data['msg'] + '</div>');
        }

    }

    function send() {
        var text = $('#text').val();
        if(text.length > 0){
            socket.send(text);
            $("#text").val('');
        }

        $("#text").focus();

    }

    function send2() {

        var json = JSON.stringify({'type': 'php', 'msg': $('#text2').attr('value')})

        socket.send(json);

    }

</script>

</body>

</html>

　　

服务端 启动

php Chat.php

访问客户端的html 浏览器打开

参考 https://www.jianshu.com/p/ac77f05bee56

swoole聊天室的更多相关文章

  1. lnmp环境 swoole聊天室

    pecl install swoole 安装php扩展swooleservice php-fpm restart 重启php服务whereis php.ini 查看php.ini的位置 查看文件是否配 ...

  2. swoole 聊天室

    1:宝塔终端安装php 2:宝塔终端检测是否安装好 php-v 3:宝塔面板安装swoole扩展,终端检测 php -m  查看扩展 扩展已经安装完毕

  3. swoole中websoket创建在线聊天室（php）

    swoole中websoket创建在线聊天室(php) swoole现仅支持Linix,macos 创建websocket服务器 首先现在服务器创建一个websocket服务器 <?php // ...

  4. 简单的聊天室代码php+swoole

    php swoole+websocket 客户端代码 <!DOCTYPE html> <html> <head> <title></title&g ...

  5. 用swoole和websocket开发简单聊天室

    首先,我想说下写代码的一些习惯,第一,任何可配置的参数或变量都要写到一个config文件中.第二,代码中一定要有日志记录和完善的报错并记录报错.言归正传,swoole应该是每个phper必须要了解的, ...

  6. Swoole实现h5版聊天室笔记

    声明:该聊天室目前只有一对多,一对一的聊天功能,另外,因为没有使用到mysql,所以还存在比较多的缺陷地方,但知道原理就差不多了,这里主要分享下swoole简易的聊天室制作思路. 开发环境:cento ...

  7. 用Swoole+React 实现的聊天室

    前后端分离的项目,使用 Swoole+React 实现的聊天室,整个项目的框架结构可以进行参考,前端 react+react-redux+react-router+react-ant 等等,后台使用 ...

  8. swoole实验版聊天室

    “swoole实验版聊天室”是依据一堂swoole培训课内容改编的,结合了bootstrap前端框架.redis数据库.jquery框架等实现基本功能,只是体现了swoole的应用,并不是为了专门写个 ...

  9. 如何利用swoole搭建一個簡易聊天室

    <?php class Chat { const HOST = '0.0.0.0';//ip地址 0.0.0.0代表接受所有ip的访问 const PART = 82;//端口号 private ...

随机推荐

  1. HmacSHA256算法(C# 和 Java)

    Java代码: /** * HmacSHA256算法,返回的结果始终是32位 * @param key 加密的键,可以是任何数据 * @param content 待加密的内容 * @return 加 ...

  2. hadoop第一次面到hr（品友互动）

    第一次“北漂” 准备了一个星期的Hadoop,把林子雨老师的视频刷了一遍,翻出了好久没用的小本本,密密麻麻的记了一大堆.刷了网上能找到的Hadoop的所有面试题(这个真的很重要) 然后,启程,北上,还 ...

  3. Spark2.x学习笔记：5、Spark On YARN模式

    https://blog.csdn.net/chengyuqiang/article/details/77864246

  4. iOS定时器按钮短时间内多次点击只触发一次事件方法

    今天在看别人代码的时候,有个个60秒获取验证码的功能,做了个定时器,按钮触发定时器,点击按钮后设置按钮的enabled为NO,逻辑来讲都是没问题的 但是实际操作的时候,恶意的在短时间内多次点击那个获取 ...

  5. 第五章 编码/加密——《跟我学Shiro》

    转发地址:https://www.iteye.com/blog/jinnianshilongnian-2021439 目录贴:跟我学Shiro目录贴 在涉及到密码存储问题上,应该加密/生成密码摘要存储 ...

  6. MySQL 全局锁和表锁

    根据加锁的范围,MySQL 里面的锁大致可以分成全局锁,表级锁,行锁. 行锁已经在前面几篇文章说过 1. 全局锁 全局锁就是对整个数据库实例加锁.MySQL 提供了一个加全局读锁的方法,命令是Flus ...

  7. Mysql统计每年每个月的数据——详细教程

    Mysql统计每年每个月的数据(前端页面统计图实现) 最终想实现的效果图,在这里就不多废话了,直接上效果图,由于测试数据有几个月是为0的,所以数据图看着会有点怪怪. 接下来是数据库的两个表,这里直接给 ...

  8. 最新 锐之旗java校招面经 （含整理过的面试题大全）

    从6月到10月,经过4个月努力和坚持,自己有幸拿到了网易雷火.京东.去哪儿.锐之旗等10家互联网公司的校招Offer,因为某些自身原因最终选择了锐之旗.6.7月主要是做系统复习.项目复盘.LeetCo ...

  9. CentOS系统安装启动tomcat

    我们可以通过xftp工具将tomcat文件上传至CentOS系统指定文件夹中 一.安装tomcat 进入tomcat存放目录解压: tar -zxf apache-tomcat-9.0.2.tar.g ...

  10. 学习笔记：oracle之win10安装卸载oracle 11gR2步骤及常见问题解决

    1.win10下安装oracle11g 1.1 工具原料 oracle11g安装包(64位) 1.2 步骤方法 1.在Oracle官网下载安装包,下载后,得到的文件如图所示: 2.将两个文件进行解压缩 ...