一、下载安装workman,地址：https://github.com/walkor/workerman

  1. composer require workerman/workerman

二、cd到workerman项目根目录下，在workerman根目录下新建game.php,然后编写五子棋服务端交互代码

  1. <?php
  2. use Workerman\Worker;
  3. require_once __DIR__ . '/vendor/autoload.php';
  5. $global_uid = 0;
  6. //棋盘大小，默认15行15列
  7. $global_i = 15;
  8. $global_j = 15;
  10. // 当客户端连上来时分配uid
  11. function handle_connection($connection)
  12. {
  13.     global $text_worker, $global_uid, $global_i, $global_j;
  14.     // 为这个链接分配一个uid
  15.     $connection->uid = ++$global_uid;
  16.     $text_worker->uidConnections[$connection->uid] = array('cons' => $connection);
  17.     $text_worker->user_data[$connection->uid] = array('playing' => 0, 'name' => '玩家' . $connection->uid, 'qipan' => array(), 'type' => 0, 'move' => 0);
  18.     $json = array('status' => 1, 'msg' => '', 'data' => array());
  19.     $json['data']['name'] = $text_worker->user_data[$connection->uid]['name'];
  20.     $connection->send(json_encode($json)); //生成玩家昵称
  21.     echo "player {$connection->uid} connected!\n";
  22.     //分配对手
  23.     foreach ($text_worker->user_data as $k => $val) {
  24.         /*var_dump($val['playing']);*/
  25.         if ($val['playing'] == 0 && $k != $connection->uid) {
  26.             //初始化棋盘
  27.             $init_data = array();
  28.             for ($i = 0; $i <= $global_i; $i++) {
  29.                 for ($j = 0; $j <= $global_j; $j++) {
  30.                     $init_data[$i][$j] = 0;
  31.                 }
  32.             }
  33.             $text_worker->user_data[$k]['qipan'] = $init_data;
  34.             $text_worker->user_data[$connection->uid]['qipan'] = $init_data;
  35.             $text_worker->user_data[$k]['playing'] = $connection->uid;
  36.             $text_worker->user_data[$connection->uid]['playing'] = $k;
  38.             //分配红黑方
  39.             $text_worker->user_data[$k]['type'] = 1;
  40.             $text_worker->user_data[$k]['move'] = 1;
  41.             $text_worker->user_data[$connection->uid]['type'] = 2;
  42.             $text_worker->user_data[$connection->uid]['move'] = 0;
  43.             $json = array('status' => 2, 'msg' => '初始化棋盘...', 'data' => array());
  44.             $json['data']['qipan'] = $init_data;
  45.             $text_worker->uidConnections[$k]['cons']->send("为你匹配到对手{$text_worker->user_data[$connection->uid]['name']}!");
  46.             $text_worker->uidConnections[$connection->uid]['cons']->send("为你匹配到对手{$val['name']}!");
  48.             break;
  49.         }
  50.     }
  52.     /*var_dump($text_worker->user_data);*/
  53. }
  55. // 当客户端发送消息过来时
  56. function handle_message($connection, $data)
  57. {
  58.     global $text_worker, $global_i, $global_j;
  59.     $data = json_decode($data, true);
  61.     if ($data['status'] == 2 && $text_worker->user_data[$connection->uid]['playing'] > 0 && $text_worker->user_data[$connection->uid]['move'] == 1) {
  62.         $my_uid = $connection->uid;
  63.         $your_uid = $text_worker->user_data[$my_uid]['playing'];
  64.         $qipan = $text_worker->user_data[$your_uid]['qipan'];
  65.         $press = explode('_', $data['data']);
  66.         array_shift($press);
  68.         if (!empty($press)) {
  69.             $press_val = $qipan[$press[0]][$press[1]];
  70.             if ($press_val != 0) {
  71.                 return;
  72.             } else {
  73.                 $qipan[$press[0]][$press[1]] = $text_worker->user_data[$my_uid]['type'];
  74.                 $text_worker->user_data[$my_uid]['qipan'] = $qipan;
  75.                 $text_worker->user_data[$your_uid]['qipan'] = $qipan;
  76.                 $text_worker->user_data[$your_uid]['move'] = 1;
  77.                 $text_worker->user_data[$my_uid]['move'] = 0;
  78.                 $json = array('status' => 2, 'msg' => '', 'data' => array());
  79.                 $json['data']['type'] = $text_worker->user_data[$my_uid]['type'];
  80.                 $json['data']['press_i'] = $press[0];
  81.                 $json['data']['press_j'] = $press[1];
  82.                 $text_worker->uidConnections[$my_uid]['cons']->send(json_encode($json));
  83.                 $text_worker->uidConnections[$your_uid]['cons']->send(json_encode($json));
  84.                 $count = get_who_win($qipan, $press[0], $press[1], $text_worker->user_data[$my_uid]['type'], $global_i, $global_j);
  85.                 file_put_contents('./qipan', json_encode($qipan));
  86.                 if ($count >= 5) { //分出胜负
  87.                     $json = array('status' => 3, 'msg' => $text_worker->user_data[$my_uid]['name'] . ' 获胜 !', 'data' => array());
  88.                     $json['data']['type'] = $text_worker->user_data[$my_uid]['type'];
  89.                     $text_worker->uidConnections[$my_uid]['cons']->send(json_encode($json));
  90.                     $text_worker->uidConnections[$your_uid]['cons']->send(json_encode($json));
  91.                 }
  92.             }
  93.         }
  94.     }
  95. }
  97. // 当客户端断开时，广播给所有客户端
  98. function handle_close($connection)
  99. {
  100.     global $text_worker;
  101.     /*foreach ($text_worker->connections as $conn) {
  102. $conn->send("user[{$connection->uid}] logout");
  103. }*/
  104. }
  106. /**
  107.  * 判断输赢
  108.  * $qipan 棋盘数据
  109.  * $i 下子时的横坐标
  110.  * $i 下子时的纵坐标
  111.  * $type 1黑方 2红方
  112.  * $global_i 棋盘边界值
  113.  * $global_j 棋盘边界值
  114.  */
  115. function get_who_win($qipan = array(), $i = -1, $j = -1, $type = 0, $global_i = 0, $global_j = 0)
  116. {
  117.     $count = 0;
  118.     $temp_type = $type;
  119.     if (empty($qipan) || $i < 0 || $j < 0 || $type <= 0) {
  120.         return $count;
  121.     }
  122.     echo json_encode($qipan) . "\n";
  123.     echo 'i=' . $i . '|j=' . $j . '|type=' . $type . '|gi=' . $global_i . '|gj=' . $global_j . "\n";
  124.     /*左右上下的判断*/
  125.     $count = 1;
  126.     $a = array(
  127.         0 => array('index' => $j, 'border' => $global_j), //左右,
  128.         1 => array('index' => $i, 'border' => $global_i) //上下
  129.     );
  131.     for ($round = 0; $round <= 1; $round++) {
  132.         $mov1_num = 1;
  133.         $mov2_num = 1;
  134.         while (true) {
  135.             $mov1 = $a[$round]['index'] + $mov1_num;
  136.             $mov2 = $a[$round]['index'] - $mov2_num;
  137.             $temp_mov1 = $temp_mov2 = -1;
  138.             if ($mov1_num > 0) {
  139.                 if ($round == 0 && $mov1 <= $global_j) {
  140.                     $temp_mov1 = $qipan[$i][$mov1];
  141.                     var_dump($i . ',' . $mov1 . ',' . $temp_mov1);
  142.                 } elseif ($round == 1 && $mov1 <= $global_i) {
  143.                     $temp_mov1 = $qipan[$mov1][$j];
  144.                 }
  146.                 if ($temp_mov1 == $temp_type) {
  147.                     $count++;
  148.                     var_dump('count=' . $count);
  149.                     $mov1_num++;
  150.                 } else {
  151.                     $mov1_num = 0;
  152.                 }
  153.             } else {
  154.                 $mov1_num = 0;
  155.             }
  157.             if ($mov2 >= 0 && $mov2_num > 0) {
  158.                 if ($round == 0) {
  159.                     $temp_mov2 = $qipan[$i][$mov2];
  160.                     var_dump($i . ',' . $mov2 . ',' . $temp_mov1);
  161.                 } elseif ($round == 1) {
  162.                     $temp_mov2 = $qipan[$mov2][$j];
  163.                 }
  165.                 if ($temp_mov2 == $temp_type) {
  166.                     $count++;
  167.                     $mov2_num++;
  168.                 } else {
  169.                     $mov2_num = 0;
  170.                 }
  171.             } else {
  172.                 $mov2_num = 0;
  173.             }
  175.             if ($count >= 5) {
  176.                 return $count;
  177.             }
  179.             if (($mov1_num == 0 && $mov2_num == 0)) {
  180.                 break;
  181.             }
  182.         }
  183.     }
  185.     /*斜角的判断*/
  187.     $count = 1;
  188.     for ($round = 0; $round <= 1; $round++) {
  189.         $mov1_num = 1;
  190.         $mov2_num = 1;
  192.         while (true) {
  193.             $temp_mov1 = $temp_mov2 = -1;
  194.             if (($i - $mov1_num) >= 0 && ($j - $mov1_num) >= 0 && ($j + $mov1_num) <= $global_j && $mov1_num > 0) {
  195.                 if ($round == 0) {
  196.                     $temp_mov1 = $qipan[$i - $mov1_num][$j + $mov1_num];
  197.                 } elseif ($round == 1) {
  198.                     $temp_mov1 = $qipan[$i - $mov1_num][$j - $mov1_num];
  199.                 }
  201.                 if ($temp_mov1 == $temp_type) {
  202.                     $count++;
  203.                     $mov1_num++;
  204.                 } else {
  205.                     $mov1_num = 0;
  206.                 }
  207.             } else {
  208.                 $mov1_num = 0;
  209.             }
  211.             if (($i + $mov2_num) <= $global_i && ($j - $mov2_num) >= 0 && ($j + $mov2_num) <= $global_j && $mov2_num > 0) {
  212.                 if ($round == 0) {
  213.                     $temp_mov2 = $qipan[$i + $mov2_num][$j - $mov2_num];
  214.                 } elseif ($round == 1) {
  215.                     $temp_mov2 = $qipan[$i + $mov2_num][$j + $mov2_num];
  216.                 }
  218.                 if ($temp_mov2 == $temp_type) {
  219.                     $count++;
  220.                     $mov2_num++;
  221.                 } else {
  222.                     $mov2_num = 0;
  223.                 }
  224.             } else {
  225.                 $mov2_num = 0;
  226.             }
  228.             if ($count >= 5) {
  229.                 return $count;
  230.             }
  232.             if (($mov1_num == 0 && $mov2_num == 0)) {
  233.                 break;
  234.             }
  235.         }
  236.     }
  237.     return $count;
  238. }
  240. // 创建一个文本协议的Worker监听2347接口
  242. $text_worker = new Worker("websocket://0.0.0.0:2347");
  243. // 只启动1个进程
  244. $text_worker->count = 1;
  245. $text_worker->uidConnections = array();
  246. $text_worker->user_data = array();
  247. $text_worker->onConnect = 'handle_connection';
  248. $text_worker->onMessage = 'handle_message';
  249. $text_worker->onClose = 'handle_close';
  250. Worker::runAll();

三、编写前端代码，这里保存为index.html

  1. <!DOCTYPE html>
  2. <html lang="en">
  4. <head>
  5. 	<meta charset="UTF-8">
  6. 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
  7. 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
  8. 	<title>Document</title>
  9. 	<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
  10. 	<style type="text/css">
  11. 		td{
  12. 			width:30px;
  13. 			height:30px;
  14. 			border:1px solid #666;
  15. 		}
  16. 		table{
  17. 			border-collapse: collapse;
  18.     		border-spacing: 0;
  19. 		}
  20. 	</style>
  21. </head>
  23. <body>
  24. 	<div class="player"></div>
  25. 	<div id="demo"></div>
  26. </body>
  28. </html>
  30. <script>
  31. 	table = "<table>";
  32. 	for (let i = 0; i <= 15; i++) {
  33. 		table += "<tr>";
  34. 		for (let j = 0; j <= 15; j++) {
  35. 			table += "<td onclick='press_on(this)' id='div_" + i + "_" + j + "'>" + "</td>";
  36. 		}
  37. 		table += "</tr>";
  38. 	}
  39. 	table += "</table>";
  40. 	$('#demo').html(table);
  42. 	ws = new WebSocket("ws://127.0.0.1:2347");
  43. 	ws.onopen = function () {
  44. 		console.log("连接成功");
  45. 	};
  47. 	ws.onmessage = function (e) {
  48. 		//alert("收到服务端的消息：" + e.data);
  49. 		console.log(e.data);
  50. 		var jsonobj = eval('(' + e.data + ')');
  51. 		if (jsonobj.status == 1 && jsonobj.data.name != null) {//初始化名字
  52. 			alert(jsonobj.data.name);
  53. 			$('.player').html(jsonobj.data.name);
  54. 		}
  56. 		if (jsonobj.status == 2) {//
  57. 			var type = jsonobj.data.type;
  58. 			var press_i = jsonobj.data.press_i;
  59. 			var press_j = jsonobj.data.press_j;
  60. 			id = '#div_' + press_i + '_' + press_j;
  61. 			$(id).unbind("click");
  62. 			if (type == 1) {
  63. 				$(id).html("<div style='background:#000000;width:30px;height:30px;border-radius:50%;'></div>");
  64. 			}
  65. 			if (type == 2) {
  66. 				$(id).html("<div style='background:#ffbc00;width:30px;height:30px;border-radius:50%;'></div>");
  67. 			}
  68. 		}
  70. 		if (jsonobj.status == 3) {//
  71. 			var msg = jsonobj.msg;
  72. 			var r = confirm(msg + '，是否从新开始?');
  73. 			if (r) {
  74. 				window.location.reload(true);
  75. 				return;
  76. 			} else {
  77. 				return;
  78. 			}
  79. 		}
  80. 	};
  82. 	function press_on(value) {
  83. 		var send = '{"status":2,"data":"' + value.id + '"}';
  84. 		console.log(send);
  85. 		ws.send(send);
  86. 	}
  87. </script>

四、运行

在命令行启动服务器php game.php

最后在浏览器地址访问index.html，进入游戏。

转载自https://blog.csdn.net/weixin_33971205/article/details/92266560

workman在线五子棋的更多相关文章

  1. jquery在线五子棋

    在线五子棋试玩地址:http://keleyi.com/game/12/ 以下是完整代码,保存到html文件打开也可以玩: <!DOCTYPE html> <html> < ...

  2. js+html5双人五子棋(源码下载)

    代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" c ...

  3. aTool在线工具

    在线HTTP POST/GET接口测试工具 - aTool在线工具 地址:http://www.atool.org/httptest.php在线接口测试工具接口测试是测试系统组件间接口的一种测试.接口 ...

  4. Web前端资源汇总

    本文地址:http://www.cnblogs.com/jihua/p/webfront.html 网页特效库 2017新年快乐特效 CSS3+jQuery实现时钟插件 Html5入门实例" ...

  5. 仿腾讯QQ竖直滑动导航菜单

    菜单就像qq软件的分组,鼠标经过自动显示相应组的内容. 效果体验网址:http://keleyi.com/a/bjad/nf86w2dv.htm 以下是源代码: <html> <he ...

  6. jQuery弹出窗口完整代码

    jQuery弹出窗口完整代码 效果体验:http://keleyi.com/keleyi/phtml/jqtexiao/1.htm 1 <!DOCTYPE html PUBLIC "- ...

  7. WC 2018/CTSC 2018/APIO 2018 游记

    (要写CTSC的时候才想起来没写WC2018,那就粗略回顾一下吧hhhhh) WC 2018(简略版): 大概和 一个宁夏和一个天津的大哥一个宿舍hhhh,字典序分宿舍真是奇妙. WC讲课真的不是人听 ...

  8. 从零开始完整开发基于websocket的在线对弈游戏【五子棋】，只用几十行代码完成全部逻辑。

    五子棋是规则简单明了的策略型游戏,先形成五子连线者获胜.本课程习作采用两人在线对弈的方式进行比赛,拿着手机在上下班路上玩特别合适. 整个过程在众触低代码应用平台进行,使用表达式描述游戏逻辑(高度简化版 ...

  9. 自己写的HTML5 Canvas + Javascript五子棋

    看到一些曾经只会灌水的网友,在学习了前端之后,已经能写出下载量几千几万的脚本.样式,帮助大众,成为受欢迎的人,感觉满羡慕的.我也想学会前端技术,变得受欢迎呀.于是心血来潮,开始学习前端知识,并写下了这 ...

  10. 完全自制的五子棋人机对战游戏（VC++实现）

    五子棋工作文档 1说明: 这个程序在创建初期的时候是有一个写的比较乱的文档的,但是很可惜回学校的时候没有带回来……所以现在赶紧整理一下,不然再过一段时间就忘干净了. 最初这个程序是受老同学所托做的,一 ...

随机推荐

  1. Educational Codeforces Round 106 (Rated for Div. 2) 简单题解（A~C）

    1499A. Domino on Windowsill 题意:给定一个 \(2 \times n\) 的空间,\(k1.k2 行要设置为白色(2 \times 1)\) 然后其他的设置为黑色 思路:为 ...

  2. 第六届蓝桥杯（2015）C/C++大学A组省赛题解

    第一题.方程整数解 答案:10 18 24,最小的为 10 int main() { ios_base::sync_with_stdio(false), cin.tie(0); for (int i ...

  3. 概率图模型 · 蒙特卡洛采样 · MCMC | 非常好的教学视频

    https://www.bilibili.com/video/BV17D4y1o7J2?p=1 非常感谢!感觉学会一点了,应该能写作业了

  4. linux 命令使用总结:vim,nohup,find,df,du,sudo,netstat,ll,curl,lastlog

    1.Vim命令使用 vim 为编辑文本命令: vim 文件  回车即可查看文件 按 字母 i 键,即可进入 insert 编辑模式. 按 ESC 键即可退出编辑模式 输入冒号:wq 即可保存修改 输入 ...

  5. Shell-流程控制-if-then-elif

  6. [官网]微软服务器TLS的支持情况

    https://learn.microsoft.com/en-us/windows/win32/secauthn/protocols-in-tls-ssl--schannel-ssp-#tls-pro ...

  7. [转帖]清除掉shared pool中某条sql语句方法

    https://www.xifenfei.com/2012/02/%E6%B8%85%E9%99%A4%E6%8E%89shared-pool%E4%B8%AD%E6%9F%90%E6%9D%A1sq ...

  8. ingress nginx 支持的K8S版本以及nginx版本信息

  9. [转帖]Jmeter学习笔记（八）——监听器元件之聚合报告

    https://www.cnblogs.com/pachongshangdexuebi/p/11507298.html 1.聚合报告添加 聚合报告是常用的监听器之一,添加路径: 点击线程组->添 ...

  10. [转帖]linux内存挂载

    1.主要功能 在linux中,为了提高读写速度,可以将内存挂载到目录,常见的文件格式有tmpfs和ramfs. 2.挂载步骤 $ sudo mkdir /mnt/tmp $ sudo mkdir /m ...