首页 > 编程 > PHP > 正文

实例详解PHP实现简单聊天室功能

2020-03-22 19:00:19
字体:
来源:转载
供稿:网友

这篇文章结合实例主要介绍了PHP实现简单的聊天室功能,有一定的参考价值,感兴趣的朋友可以参考一下,希望对你有所帮助!

前端部分:

<!DOCTYPE html><html><head>    <meta charset="UTF-8">    <title>聊天室</title></head><style>    #set_name{        margin: auto;        text-align: center;    }</style><body><h3 style="text-align: center">亮亮的聊天室</h3><div id="set_name">姓名:<input name="name" id="name"><input type="button" onclick="set_name();" value="进入群聊"></div><div id="chat" style="width: 600px; border: red 1px solid;margin: auto;display: none">    <div id="sayContent" style="height: 300px;border-bottom: silver 1px dashed;">    </div>    <div style="height: 75px;margin-top: 10px">        <textarea id="content" style="height: 50px;width: 480px;background-color: #00a0e9;float: left;"></textarea>        <button id="submit" style="float: right;height: 55px;width:50px;margin-right:45px;display: block;" onclick="send_msg();">发送</button>    </div></div><script>    var name = ws = '' ;    //执行websock    function chat() {        var wsserver = 'ws://47.94.11.195:443';        //调用WebSocket对象建立连接        //ws  wss: // ip:port(字符串)        ws = new WebSocket(wsserver);        //获取聊天内容展示窗口        var sayContent = document.getElementById('sayContent');        //onopen监听连接打开        ws.onopen = function (v) {            var user = new Object();            user.name = name;            user.type = 1;//对用户设置姓名            var json = JSON.stringify(user);            ws.send(json);//发送数据        }        //onmessage监听服务器数据推送        ws.onmessage = function (v) {            var html = sayContent.innerHTML;            sayContent.innerHTML = html + "<br>"+v.data;        }        //监听连接关闭        ws.onclose = function (v) {            var html = sayContent.innerHTML;            sayContent.innerHTML = html + "<br>聊天室已关闭!";        }    }    //设置用户名    function set_name() {        name = document.getElementById('name').value;        if(name == ''){            alert('请输入用户名!');            return false;        }        document.getElementById('set_name').style.display='none';        document.getElementById('chat').style.display='block';        chat();    }    function send_msg() {        var content = document.getElementById('content');        if(content.value == ''){            alert('请输入聊天内容!');            return false;        }        var msg = new Object();        msg.content = content.value;        msg.type = 2;        var str = JSON.stringify(msg);        ws.send(str);    }</script></body></html>

后台部分:

<?php$server = new swoole_websocket_server("0.0.0.0", 443);$server->users = [];$server->on('open', function (swoole_websocket_server $server, $request) {    $server->users[$request->fd]['id'] = $request->fd;});$server->on('message', function (swoole_websocket_server $server, $frame) {    $data = json_decode($frame->data,true);    if($data['type'] == 1){        $server->users[$frame->fd]['name']=$data['name'];        $server->push($frame->fd,'欢迎您('.$data['name'].')进入聊天室!');    }else{        foreach($server->users as $v){            $server->push($v['id'], $server->users[$frame->fd]['name'].'说:'.$data['content']);        }    }});$server->on('close', function ($ser, $fd) {    file_put_contents('qq.txt',$server->users[$frame->fd],FILE_APPEND);    unset($server->users[$frame->fd]);});$server->start();

更多相关教程请访问 php编程从入门到精通全套视频教程

郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表