zoukankan      html  css  js  c++  java
  • 02 workerman之GatewayWorker简单的demo 实现两端发送消息

    前端代码:

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <title></title>
        </head>
        <body>
            内容:<input type="text" name="msg" id="msg" value="" />
            <button onclick="sendMsg()">发送</button>
            <script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
            <script>
            //创建websocket 对象    
            var ws = new WebSocket("ws://127.0.0.1:8282");
            
            //当连接准备好时,则触发
            ws.onopen = function(e) {
                //绑定id
                  var fromid=getUrlParam('fromid');
                var toid=getUrlParam('toid');
                var message = '{"type":"bind","fromid":"'+fromid+'","toid":"'+toid+'"}';
                ws.send(message);
            };
            
            //从服务器收到消息时,该监听器将被调用
            ws.onmessage = function(e){
                var message = JSON.parse(e.data);
                console.log(message);
                if(message.type == "say"){
                    alert(message.msg);
                }
            }
            
            //当连接关闭时,则触发
            ws.onclose = function(e) {
              console.log(e);
            };
            
            //发送数据
            function sendMsg(){
                var fromid=getUrlParam('fromid');
                var toid=getUrlParam('toid');
                var msg=$("#msg").val();
                var message = '{"type":"say","fromid":"'+fromid+'","toid":"'+toid+'","msg":"'+msg+'"}';
                ws.send(message);
            }
            
            
            /**
             * GET取值,用于接受?传值 可接收汉字 推荐使用
             */
            function getUrlParam(name){
                // 用该属性获取页面 URL 地址从问号 (?) 开始的 URL(查询部分)
                var url = window.location.search;
                // 正则筛选地址栏
                var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
                // 匹配目标参数
                var result = url.substr(1).match(reg);
                //返回参数值
                return result ? decodeURIComponent(result[2]) : null;
            }
            </script>
        </body>
    </html>

    后端代码:

    ps:修改后端代码后请重启服务端 wind上重启cmd窗口

    <?php
    /**
     * This file is part of workerman.
     *
     * Licensed under The MIT License
     * For full copyright and license information, please see the MIT-LICENSE.txt
     * Redistributions of files must retain the above copyright notice.
     *
     * @author walkor<walkor@workerman.net>
     * @copyright walkor<walkor@workerman.net>
     * @link http://www.workerman.net/
     * @license http://www.opensource.org/licenses/mit-license.php MIT License
     */
    
    /**
     * 用于检测业务代码死循环或者长时间阻塞等问题
     * 如果发现业务卡死,可以将下面declare打开(去掉//注释),并执行php start.php reload
     * 然后观察一段时间workerman.log看是否有process_timeout异常
     */
    //declare(ticks=1);
    
    use GatewayWorkerLibGateway;
    
    /**
     * 主逻辑
     * 主要是处理 onConnect onMessage onClose 三个方法
     * onConnect 和 onClose 如果不需要可以不用实现并删除
     */
    class Events
    {
        /**
         * 当客户端连接时触发
         * 如果业务不需此回调可以删除onConnect
         * 
         * @param int $client_id 连接id
         */
        public static function onConnect($client_id)
        {
            // 向当前client_id发送数据 
            //Gateway::sendToClient($client_id, "Hello $client_id
    ");
            // 向所有人发送
            //Gateway::sendToAll("$client_id login
    ");
        }
        
       /**
        * 当客户端发来消息时触发
        * @param int $client_id 连接id
        * @param mixed $message 具体消息
        */
       public static function onMessage($client_id, $message)
       {
            $req_data = json_decode($message, true);
            //绑定id
            if($req_data['type'] == 'bind'){
              Gateway::bindUid($client_id, $req_data['fromid']);
              $msg='{"type":"say","fromid":"'.$req_data['fromid'].'","toid":"'.$req_data['fromid'].'","msg":"'+msg+'"}';
              $message=[
                'type'=>'bind',
                'fromid'=>$req_data['fromid'],
                'toid'=>$req_data['toid'],
                'msg'=>'绑定成功'
              ];
              Gateway::sendToUid($req_data['fromid'], json_encode($message,JSON_UNESCAPED_UNICODE));
            }
            //发送消息
            if($req_data['type'] == 'say'){
               $message=[
                'type'=>'say',
                'fromid'=>$req_data['fromid'],
                'toid'=>$req_data['toid'],
                'msg'=>$req_data['msg']
              ];
              Gateway::sendToUid($req_data['toid'], json_encode($message,JSON_UNESCAPED_UNICODE));
            }
       }
       
       /**
        * 当用户断开连接时触发
        * @param int $client_id 连接id
        */
       public static function onClose($client_id)
       {
           // 向所有人发送 
           //GateWay::sendToAll("$client_id logout
    ");
       }
    }

    效果:

  • 相关阅读:
    ACM Red and Black
    ACM Wooden Stricks
    ACM Strange fuction
    ACM pie
    ACM Doing Homework again
    ACM FatMouse' Trade
    ACM 今年暑假不AC
    ACM Ignatius and the Princess II
    一、数组---第三大的数
    一、数组---移动零※※※※※※
  • 原文地址:https://www.cnblogs.com/wordblog/p/10593928.html
Copyright © 2011-2022 走看看