地图改为后端生成+前端绘制

This commit is contained in:
2023-02-27 23:01:11 +08:00
parent e6e6bc15e9
commit e6c49ad600
6 changed files with 198 additions and 44 deletions
@@ -3,6 +3,7 @@ package com.kob.backend.consumer;
// WebSocket用于前后端通信
import com.alibaba.fastjson2.JSONObject;
import com.kob.backend.consumer.utils.Game;
import com.kob.backend.consumer.utils.JwtAuthenticationUtil;
import com.kob.backend.mapper.UserMapper;
import com.kob.backend.pojo.User;
@@ -20,12 +21,10 @@ import java.util.concurrent.CopyOnWriteArraySet;
@Component
@ServerEndpoint("/websocket/{token}") // 注意不要以'/'结尾
public class WebSocketServer {
// 后端向前端发送信息,首先需要创建一个 session
// 后端向前端发送信息,首先需要创建一个 session
private Session session = null;
// 用户信息:定义一个成员变量
// 用户信息:定义一个成员变量
private User user;
/*
存储所有链接:对所有 websocket 可见的全局变量,存储为 static 静态变量
因为每个 websocket 实例都在一个独立的线程里,所以该公共变量应该是线程安全的
@@ -33,43 +32,40 @@ public class WebSocketServer {
将 userId 映射到 webSocketServer
*/
private static final ConcurrentHashMap<Integer, WebSocketServer> users = new ConcurrentHashMap<>();
// 使用 CopyOnWriteArraySet 创建一个线程安全的匹配池 matchPool
// 使用 CopyOnWriteArraySet 创建一个线程安全的匹配池 matchPool
private static final CopyOnWriteArraySet<User> matchPool = new CopyOnWriteArraySet<>();
//在 WebSocketServer 中注入数据库的方法演示-> 使用 static 定义为独一份的变量
// 在 WebSocketServer 中注入数据库的方法演示-> 使用 static 定义为独一份的变量
private static UserMapper userMapper;
// 注入方法
// 注入方法
@Autowired
public void setUserMapper(UserMapper userMapper) {
// 静态变量 userMapper 访问需要使用类名 WebSocketServer 访问
// 静态变量 userMapper 访问需要使用类名 WebSocketServer 访问
WebSocketServer.userMapper = userMapper;
}
// @OnOpen 创建链接时自动触发这个函数
// @OnOpen 创建链接时自动触发这个函数
@OnOpen
public void onOpen(Session session, @PathParam("token") String token) throws IOException {
// 建立链接时需要将 session 存下来
this.session = session;
// 成功建立连接时,输出 connected!
// 成功建立连接时,输出 connected!
System.out.println("backend connected!");
// 将 userId 取出来,通过 userId 将 user 找出来
// int userId = Integer.parseInt(token);
// 将 userId 取出来,通过 userId 将 user 找出来
// int userId = Integer.parseInt(token);
int userId = JwtAuthenticationUtil.getUserId(token);
this.user = userMapper.selectById(userId);
// 如果 user 存在, 表示用户登录成功, 用户信息是存在的
// 如果 user 存在, 表示用户登录成功, 用户信息是存在的
if (this.user != null) {
// 将 user 存到 users HashMap里
users.put(userId, this);
// (测试)后台输出看用户信息
// System.out.println(user);
// System.out.println(user);
}
// 否则,断开连接(这里需要抛出异常)
// 否则,断开连接(这里需要抛出异常)
else {
this.session.close();
}
@@ -81,25 +77,25 @@ public class WebSocketServer {
public void onClose() {
// 关闭链接
System.out.println("backend disconnected!");
// 断开连接时,需要将 user 从 users 里面删掉
// 断开连接时,需要将 user 从 users 里面删掉
if (this.user != null) {
users.remove(this.user.getId());
// 将匹配池数组删掉
// 将匹配池数组删掉
matchPool.remove(this.user);
}
}
// @OnMessage 用于从前端接收请求: 一般 onMessage 当成路由使用,做为消息判断处理的中间部分
// @OnMessage 用于从前端接收请求: 一般 onMessage 当成路由使用,做为消息判断处理的中间部分
@OnMessage
public void onMessage(String message, Session session) {
// 从 Client 接收消息
System.out.println("receive message");
// 解析从前端接收到的请求
// 解析从前端接收到的请求
JSONObject data = JSONObject.parseObject(message);
String event = data.getString("event");
// System.out.println(event);
// System.out.println(event);
// 匹配状态函数调用
// 匹配状态函数调用
if ("start-matching".equals(event)) {
startMatching();
} else if ("stop-matching".equals(event)) {
@@ -112,12 +108,12 @@ public class WebSocketServer {
error.printStackTrace();
}
// 从后端向前端发送信息
// 从后端向前端发送信息
public void sendMessage(String message) {
// 异步通信过程,先加一个锁
// 异步通信过程,先加一个锁
synchronized (this.session) {
try {
// 将 message 发送到前端
// 将 message 发送到前端
this.session.getBasicRemote().sendText(message);
} catch (IOException e) {
e.printStackTrace();
@@ -125,37 +121,43 @@ public class WebSocketServer {
}
}
// 开始匹配的逻辑部分
// 开始匹配的逻辑部分
private void startMatching() {
System.out.println("start matching");
matchPool.add(this.user);
while (matchPool.size()>=2){
// 迭代器用于枚举前两个人进行匹配
// 迭代器用于枚举前两个人进行匹配
Iterator<User> it = matchPool.iterator();
User a = it.next(), b = it.next();
// 取出两个人之后,从匹配池中将他们删除
// 取出两个人之后,从匹配池中将他们删除
matchPool.remove(a);
matchPool.remove(b);
// 将 a 配对成功的消息传回客户端
// 匹配成功时,创建联机地图
Game game = new Game(13,14,20);
game.createMap(); // 初始化地图
// 将 a 配对成功的消息传回客户端
JSONObject respA = new JSONObject();
respA.put("event","start-matching");
respA.put("opponent_username",b.getUsername());
respA.put("opponent_photo",b.getPhoto());
// 获取 a 的链接,并通过 sendMessage 将消息传给前端
respA.put("game_map",game.getG());
// 获取 a 的链接,并通过 sendMessage 将消息传给前端
users.get(a.getId()).sendMessage(respA.toJSONString());
// 同理,将 b 的匹配成功信息传回给前端
// 同理,将 b 的匹配成功信息传回给前端
JSONObject respB = new JSONObject();
respB.put("event","start-matching");
respB.put("opponent_username",a.getUsername());
respB.put("opponent_photo",a.getPhoto());
respB.put("game_map",game.getG());
users.get(b.getId()).sendMessage(respB.toJSONString());
}
}
// 取消匹配的逻辑部分
// 取消匹配的逻辑部分
private void stopMatching() {
System.out.println("stop matching");
matchPool.remove(this.user);
@@ -0,0 +1,110 @@
package com.kob.backend.consumer.utils;
import java.util.Random;
// 用来管理整个游戏流程
public class Game {
// 游戏地图:行数,列数,内部障碍物数量
private final Integer rows;
private final Integer cols;
private final Integer inner_walls_count;
// 地图数组
private final int[][] g;
// 定义"上右下左"四个方向的 dx, dy偏移量
private final int[] dx = {-1, 0, 1, 0}, dy = {0, 1, 0, -1};
// 初始化构造函数
public Game(Integer rows, Integer cols, Integer inner_walls_count) {
this.rows = rows;
this.cols = cols;
this.inner_walls_count = rows;
this.g = new int[rows][cols];
}
// 返回生成的地图
public int[][] getG() {
return g;
}
// 画地图
public boolean draw() {
// 一开始现将所有障碍物初始化为 false
for (int r = 0; r < this.rows; r++) {
for (int c = 0; c < this.cols; c++) {
// 0 表示空地, 1 表示障碍物(墙)
g[r][c] = 0;
}
}
// 地图左右边缘障碍物
for (int r = 0; r < this.rows; r++) {
g[r][0] = g[r][this.cols - 1] = 1;
}
// 地图上下边缘障碍物
for (int c = 0; c < this.cols; c++) {
g[0][c] = g[this.rows - 1][c] = 1;
}
Random random = new Random();
// 创建内部随机障碍物,每次计算时会生成两个障碍物,因此这里的循环次数 this.inner_walls_count 需要处以 2
for (int i = 0; i < this.inner_walls_count / 2; i++) {
// 避免位置重复:重复遍历 1000 次,只要找到了已经存在障碍物的位置就禁止随机
for (int j = 0; j < 1000; j++) {
// 找出本次随机到的行-r 列-c 坐标
int r = random.nextInt(this.rows); // random.nextInt(7) 返回 0-7之间的随机整数
int c = random.nextInt(this.cols);
// 中心对称:当本坐标或者它的中心对称坐标已经存在障碍物了,则重新计算下一个坐标
if (g[r][c] == 1 || g[this.rows - 1 - r][this.cols - 1 - c] == 1)
continue;
// 避免内部障碍物覆盖掉左下角和右上角的 A-B 角色出发点,如果是这两个位置,则重新计算下一个坐标
if (r == this.rows - 2 && c == 1 || r == 1 && c == this.cols - 2)
continue;
// 将计算求得的随机障碍物合法的位置赋值为 1 ,以对该位置进行绘制(包括本坐标及其中心对称坐标)
g[r][c] = g[this.rows - 1 - r][this.cols - 1 - c] = 1;
// 1000 次遍历中,规定数量的内部障碍物已经够数之后就 break 掉
break;
}
}
// 确保 A-B 角色的运动区域是联通的:如果不连通,则直接在创建地图对象之前取消绘制( return false )
return check_connectivity(this.rows - 2, 1, 1, this.cols - 2);
}
// 联通检测方法---true(联通)---false(不通),参数: 起点坐标 sx,sy ,终点坐标 tx,ty
private boolean check_connectivity(int sx, int sy, int tx, int ty) {
// 起点就是终点时,结果联通,直接返回 true
if (sx == tx && sy == ty) return true;
g[sx][sy] = 1;
//枚举"上右下左"四个方向,求当前点下一个相邻点的坐标
for (int i = 0; i < 4; i++) {
int x = sx + dx[i];
int y = sy + dy[i];
// 判断是否撞到障碍物( g[x][y] == 0 表示没有碰到障碍物 ),如果没有赚到障碍物,且可以找到重点的话,返回 true(联通)
if (x >= 0 && x < this.rows && y >= 0 && y < this.cols && g[x][y] == 0) {
if (check_connectivity(x, y, tx, ty)) {
// 还原状态
g[sx][sy] = 0;
return true;
}
}
}
// 还原状态
g[sx][sy] = 0;
return true;
}
public void createMap() {
// 循环绘制:如果发现哪次循环中画地图成功了,则跳出循环,绘制结束
for (int i = 0; i < 1000; i++) {
if (draw())
break;
}
}
}