Java|Java Websocket Canvas实现井字棋网络游戏 JavaWebsocketCanvas实现井字棋网络

本文实例为大家分享了Java Websocket Canvas实现井字棋网络游戏的具体代码，供大家参考，具体内容如下

文章图片

TicTacToeGame.java

import javax.websocket.OnClose; import javax.websocket.OnMessage; import javax.websocket.OnOpen; import javax.websocket.Session; import javax.websocket.server.ServerEndpoint; import java.io.IOException; import java.util.Set; import java.util.concurrent.CopyOnWriteArraySet; @ServerEndpoint("/tictactoe")public class TicTacToeGame { private static final Set games = new CopyOnWriteArraySet<>(); private Session session; private String player; private static String b1 = ""; private static String b2 = ""; private static String b3 = ""; private static String b4 = ""; private static String b5 = ""; private static String b6 = ""; private static String b7 = ""; private static String b8 = ""; private static String b9 = ""; @OnOpen public void onOpen(Session session) throws IOException {System.out.println("Connection from" + session.getId()); this.session = session; System.out.println(games.size()); if (games.size() == 0) {this.player = "X"; }if (games.size() == 1) {this.player = "O"; }if (games.size() > 1) {System.out.println("房间人满"); session.getBasicRemote().sendText("roomfull"); //session.close(); } else {games.add(this); session.getBasicRemote().sendText("player-" + player); if (games.size() == 1) {sendText("wait"); }if (games.size() == 2) {sendText("start"); }sendText("turn-" + "X"); } } @OnMessage public void onMessage(String message) {System.out.println(player); System.out.println(message); System.out.println(message.indexOf("place")); if (message.indexOf("place") != -1) {String[] words = message.split("-"); System.out.println("words[1]=" + words[1]); System.out.println("words[2]=" + words[2]); System.out.println("games.size()=" + games.size()); if (games.size() > 1) {if ("".equals(getPlayer(words[1]))) {place3(words[1], words[2]); sendText(message); check(); if ("X".equals(words[2])) {sendText("turn-" + "O"); } else {sendText("turn-" + "X"); }}}System.out.println("b1=" + b1); System.out.println("b2=" + b2); System.out.println("b3=" + b3); System.out.println("b4=" + b4); System.out.println("b5=" + b5); System.out.println("b6=" + b6); System.out.println("b7=" + b7); System.out.println("b8=" + b8); System.out.println("b9=" + b9); } else if ("reset".equals(message)) {if (player.equals("X") || player.equals("O")) {b1 = ""; b2 = ""; b3 = ""; b4 = ""; b5 = ""; b6 = ""; b7 = ""; b8 = ""; b9 = ""; sendText(message); }} else {sendText(message); } } private static void sendText(String msg) {for (TicTacToeGame game : games) {try {synchronized (game) {game.session.getBasicRemote().sendText(msg); }} catch (IOException e) {games.remove(game); try {game.session.close(); } catch (IOException e1) {}sendText("leave-" + game.player); }} } @OnClose public void onClose(Session session) {System.out.println(session.getId()); System.out.println(this.player + "已下线"); if (!"".equals(this.player)) {games.remove(this); sendText("leave-" + this.player); } } public void place3(String id, String player) {if ("b1".equals(id)) {b1 = player; }if ("b2".equals(id)) {b2 = player; }if ("b3".equals(id)) {b3 = player; }if ("b4".equals(id)) {b4 = player; }if ("b5".equals(id)) {b5 = player; }if ("b6".equals(id)) {b6 = player; }if ("b7".equals(id)) {b7 = player; }if ("b8".equals(id)) {b8 = player; }if ("b9".equals(id)) {b9 = player; } } public String getPlayer(String id) {String player = ""; if ("b1".equals(id)) {player = b1; }if ("b2".equals(id)) {player = b2; }if ("b3".equals(id)) {player = b3; }if ("b4".equals(id)) {player = b4; }if ("b5".equals(id)) {player = b5; }if ("b6".equals(id)) {player = b6; }if ("b7".equals(id)) {player = b7; }if ("b8".equals(id)) {player = b8; }if ("b9".equals(id)) {player = b9; }return player; } public void check() { if (b1.equals("X") && b2.equals("X") && b3.equals("X")) {sendText("xwon"); sendText("gameover-YES"); } else if (b1.equals("X") && b4.equals("X") && b7.equals("X")) {sendText("xwon"); sendText("gameover-YES"); } else if (b7.equals("X") && b8.equals("X") && b9.equals("X")) {sendText("xwon"); sendText("gameover-YES"); } else if (b3.equals("X") && b6.equals("X") && b9.equals("X")) {sendText("xwon"); sendText("gameover-YES"); } else if (b1.equals("X") && b5.equals("X") && b9.equals("X")) {sendText("xwon"); sendText("gameover-YES"); } else if (b3.equals("X") && b5.equals("X") && b7.equals("X")) {sendText("xwon"); sendText("gameover-YES"); } else if (b2.equals("X") && b5.equals("X") && b8.equals("X")) {sendText("xwon"); sendText("gameover-YES"); } else if (b4.equals("X") && b5.equals("X") && b6.equals("X")) {sendText("xwon"); sendText("gameover-YES"); } else if (b1.equals("O") && b2.equals("O") && b3.equals("O")) {sendText("owon"); sendText("gameover-YES"); } else if (b1.equals("O") && b4.equals("O") && b7.equals("O")) {sendText("owon"); sendText("gameover-YES"); } else if (b7.equals("O") && b8.equals("O") && b9.equals("O")) {sendText("owon"); sendText("gameover-YES"); } else if (b3.equals("O") && b6.equals("O") && b9.equals("O")) {sendText("owon"); sendText("gameover-YES"); } else if (b1.equals("O") && b5.equals("O") && b9.equals("O")) {sendText("owon"); sendText("gameover-YES"); } else if (b3.equals("O") && b5.equals("O") && b7.equals("O")) {sendText("owon"); sendText("gameover-YES"); } else if (b2.equals("O") && b5.equals("O") && b8.equals("O")) {sendText("owon"); sendText("gameover-YES"); } else if (b4.equals("O") && b5.equals("O") && b6.equals("O")) {sendText("owon"); sendText("gameover-YES"); } // Checking of Player O finsh// Here, Checking about Tieelse if ((b1.equals("X") || b1.equals("O")) && (b2.equals("X") || b2.equals("O"))&& (b3.equals("X") || b3.equals("O")) && (b4.equals("X") || b4.equals("O"))&& (b5.equals("X") || b5.equals("O")) && (b6.equals("X") || b6.equals("O"))&& (b7.equals("X") || b7.equals("O")) && (b8.equals("X") || b8.equals("O"))&& (b9.equals("X") || b9.equals("O"))) {sendText("tie"); sendText("gameover-YES"); } else { } }}

【Java|Java Websocket Canvas实现井字棋网络游戏】index.html

TIC TAC TOE

tic.js

// Function called whenever user tab on any boxplayer = ""; turn = ""; gameover = "NO"; // Function to reset gamefunction reset() {message = "reset"; websocket.send(message); message = "turn-X"; websocket.send(message); }function reset2() {clear(); drawboard(); gameover = "NO"; document.getElementById("print2").innerHTML = "游戏开始, 请开始放置棋子"; } // Here onwards, functions check turn of the player// and put accordingly innerText X or Oflag = 1; function place(id) {if (gameover === "NO") {if (flag === 1) {if (document.getElementById(id).innerText === "") {document.getElementById(id).innerText = "X"; flag = 0; }} else {if (document.getElementById(id).innerText === "") {document.getElementById(id).innerText = "O"; flag = 1; }}}check(); }function place2(id) {if (gameover === "NO") {if (turn === player) {if (document.getElementById(id).innerText === "") {message = "place-" + id + "-" + player; websocket.send(message); }}}} //function place3(id, player) {//document.getElementById(id).innerText = player; //check(); //} function getRootUri() {return "ws://" + (document.location.hostname == "" ? "localhost" : document.location.hostname) + ":" +(document.location.port == "" ? "8080" : document.location.port); } function init() {output = document.getElementById("output"); websocket = new WebSocket(getRootUri() + "/TicTacToeWebSocket/tictactoe"); websocket.onopen = function (evt) {onOpen(evt)}; websocket.onmessage = function (evt) {onMessage(evt)}; websocket.onerror = function (evt) {onError(evt)}; } function onMessage(evt) {console.log(evt.data); if (evt.data =https://www.it610.com/article/="roomfull") {document.getElementById("print").innerHTML = "游戏玩家已满"; websocket.close(-1); }if (evt.data =https://www.it610.com/article/="reset") {reset2(); }if (evt.data =https://www.it610.com/article/="wait") {//window.alert("Waiting for Second Player"); document.getElementById("print2").innerHTML = "等待第二个玩家"; }if (evt.data =https://www.it610.com/article/="start") {reset(); }if (evt.data =https://www.it610.com/article/="xwon") {document.getElementById("print2").innerHTML = "玩家X赢了"; }if (evt.data =https://www.it610.com/article/="owon") {document.getElementById("print2").innerHTML = "玩家O赢了"; }if (evt.data =https://www.it610.com/article/="tie") {document.getElementById("print2").innerHTML = "平局"; }if (evt.data.indexOf("leave") != -1) {//window.alert(evt.data); words = evt.data.split("-"); //window.alert(words[1]); player = words[1]; //window.alert(player); document.getElementById("print2").innerHTML = "玩家" + player+"已离开游戏,请退出游戏"; }if (evt.data.indexOf("player") != -1) {//window.alert(evt.data); words = evt.data.split("-"); //window.alert(words[1]); player = words[1]; //window.alert(player); document.getElementById("player").innerHTML = "你是玩家" + player; }if (evt.data.indexOf("turn") != -1) {//window.alert(evt.data); words = evt.data.split("-"); //window.alert(words[1]); turn = words[1]; //window.alert(turn); document.getElementById("print").innerHTML = "当前由玩家" + turn + "放置棋子"; }if (evt.data.indexOf("place") != -1) {//window.alert(evt.data); words = evt.data.split("-"); //window.alert(words[1]); place3(words[1], words[2]); }if (evt.data.indexOf("gameover") != -1) {//window.alert(evt.data); words = evt.data.split("-"); //window.alert(words[1]); gameover = words[1]; //window.alert(turn); document.getElementById("print").innerHTML = "游戏结束！"; }} function onOpen(evt) {}function onError(evt) {} players = 2; cell_count = 3; winCount = 3; cell_size = 100; size = cell_size * cell_count; var canvas = document.getElementById('canvas'); canvas.width = size; canvas.height = size; canvas.addEventListener('click', click, false); var ctx = canvas.getContext('2d'); ctx.imageSmoothingEnabled = false; ctx.lineWidth = 3; function clear() {ctx.clearRect(0, 0, canvas.width, canvas.height); } function line(x, y, w, h, color = '#ccc') {ctx.beginPath(); ctx.moveTo(x, y); ctx.lineTo(x + w, y + h); ctx.strokeStyle = color; ctx.stroke(); ctx.closePath(); } function click(e) {if (gameover === "NO") {if (turn === player) {i = e.offsetX / cell_size | 0; j = e.offsetY / cell_size | 0; id = ""; if (i == 0 && j == 0) {id = "b1"; }if (i == 1 && j == 0) {id = "b2"; }if (i == 2 && j == 0) {id = "b3"; ; }if (i == 0 && j == 1) {id = "b4"; }if (i == 1 && j == 1) {id = "b5"; }if (i == 2 && j == 1) {id = "b6"; }if (i == 0 && j == 2) {id = "b7"; }if (i == 1 && j == 2) {id = "b8"; }if (i == 2 && j == 2) {id = "b9"; }message = "place-" + id + "-" + player; websocket.send(message); }}}function place3(id, player) {i = 0; j = 0; if (id === "b1") {i = 0; j = 0; }if (id === "b2") {i = 1; j = 0; }if (id === "b3") {i = 2; j = 0; }if (id === "b4") {i = 0; j = 1; }if (id === "b5") {i = 1; j = 1; }if (id === "b6") {i = 2; j = 1; }if (id === "b7") {i = 0; j = 2; }if (id === "b8") {i = 1; j = 2; }if (id === "b9") {i = 2; j = 2; } if (player === "X") {//window.alert("X"); // draw X figurecolor = '#3F51B5'; left = (i + 0.1) * cell_size; up = (j + 0.1) * cell_size; size = 0.8 * cell_size; //window.alert(left); //window.alert("up="+up); //window.alert(size); line(left, up, size, size, color); line(left + size, up, -size, size, color); }if (player === "O") {color = '#FF5722'; left = (i + 0.1) * cell_size; up = (j + 0.1) * cell_size; size = 0.8 * cell_size; ctx.beginPath(); ctx.arc((i + 0.5) * cell_size, (j + 0.5) * cell_size, 0.4 * cell_size, 0, Math.PI * 2, false); ctx.strokeStyle = color; ctx.stroke(); ctx.closePath(); }} function drawboard() {for (let i = 0; i < cell_count; i++) {for (let j = 0; j < cell_count; j++) {left = i * cell_size; up = j * cell_size; size = cell_size; ctx.beginPath(); ctx.lineWidth = "6"; ctx.strokeStyle = "gray"; ctx.rect(left, up, size, size); ctx.stroke(); } } }drawboard(); window.addEventListener("load", init, false);

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。