在Tomcat7.0.64下的examples文件夹内,有多人贪吃蛇的例子。

Multiplayer snake

这是一个多人在线小游戏,客户端通过操作上下左右键指挥自己的蛇,如果碰到别的蛇就死掉。还是一样,在服务端,对每个连接都维护一条蛇,有一个总的逻辑代码处理这些蛇,每条蛇再有各自的状态,向每个连接的客户发送消息。

1、@ServerEndpoint注解定义了一个WebSocket的访问路径,在Html页面中,通过ws开头的协议名称+项目地址+访问路径,即可建立WebSocket链接。

@ServerEndpoint创建的对象为非单例模式,每次建立WebSocket链接的时候,都会创建新的对象。

用两个浏览器打开该页面,生成的如下两个对象。

com.jiafuwei.java.snake.SnakeAnnotation@bda138

com.jiafuwei.java.snake.SnakeAnnotation@afca52

在这两个SnakeAnnotation对象中,通过@OnOpen注解会分别创建两个Snake对象

com.jiafuwei.java.snake.Snake@15b40dd
com.jiafuwei.java.snake.Snake@17e2247

生成的Snake对象分别会被各自的SnakeAnnotation对象维护,当我们在网页中触发上下左右移动的按钮时,会触发@OnMessage注解,从而改变Snake对象的方向,SnakeTimer定时任务每个0.1秒执行一次,向所有在线的浏览器广播所有蛇的位置,这样在线的蛇就位置就通过websocket同步了。

@ServerEndpoint(value = "/websocket/snake")
public class SnakeAnnotation {
  private Snake snake;
}
host = 'ws://' + window.location.host + '/Snake/websocket/snake';
if ('WebSocket' in window) {
Game.socket = new WebSocket(host);
} else if ('MozWebSocket' in window) {
Game.socket = new MozWebSocket(host);
} else {
Console.log('Error: WebSocket is not supported by this browser.');
return;
}
2、通过两个浏览器分别打开贪吃蛇的游戏页面,Html页面通过onopen方法触发后台的逻辑方法为@OnOpen注解
@OnOpen
public void onOpen(Session session) {
this.snake = new Snake(id, session);
SnakeTimer.addSnake(snake);
StringBuilder sb = new StringBuilder();
for (Iterator<Snake> iterator = SnakeTimer.getSnakes().iterator();
iterator.hasNext();) {
Snake snake = iterator.next();
sb.append(String.format("{id: %d, color: '%s'}",
Integer.valueOf(snake.getId()), snake.getHexColor()));
if (iterator.hasNext()) {
sb.append(',');
}
}
SnakeTimer.broadcast(String.format("{'type': 'join','data':[%s]}",
sb.toString()));
}
Game.socket.onopen = function () {
// Socket open.. start the game loop.
Console.log('Info: WebSocket connection opened.');
Console.log('Info: Press an arrow key to begin.');
Game.startGameLoop();
setInterval(function() {
// Prevent server read timeout.
Game.socket.send('ping');
}, 5000);
};

项目源码地址: http://git.oschina.net/jiafuwei0407/Snake

WebSocket贪吃蛇例子学习的更多相关文章

  1. jQuery贪吃蛇--jQuery学习

    我用JQuery有一段时间了,越来越体会到其强大之处,于是自己尝试写了一个贪吃蛇小游戏,拿来与网友分享一下. 1. 了解JQuery.Timers 除用到了jQuery1.5.1之外,我还用到了jQu ...

  2. QT下的贪吃蛇

    QT写的贪吃蛇,学习于https://www.devbean.net/2012/12/qt-study-road-2-snake-1/ 建议就学习一下开发思想,开发游戏还是用专门的编译器. 多加了墙, ...

  3. Qt 学习之路 2(31):贪吃蛇游戏(1)

    Qt 学习之路 2(31):贪吃蛇游戏(1) 豆子 2012年12月18日 Qt 学习之路 2 41条评论 经过前面一段时间的学习,我们已经了解到有关 Qt 相当多的知识.现在,我们将把前面所讲过的知 ...

  4. 小菜学习Winform(一)贪吃蛇2

    前言 上一篇<小菜学习Winform(一)贪吃蛇>中实现了简单版的贪吃蛇,在文章末也提到需要优化的地方,比如使用oo.得分模式.速度加快模式和减少界面重绘.因为是优化篇,实现方式上一篇有, ...

  5. 小菜学习Winform(一)贪吃蛇

    前言 说到贪吃蛇,大家可能小时候都玩过,小菜最近在整理Winfrom的学习系列,那我觉得有兴趣才会有学习,就从这个小游戏讲起吧. 实现 其实我刚开始学习编程的时候,感觉写个贪吃蛇的程序会很难,因为涉及 ...

  6. 以小时候玩的贪吃蛇为例,对于Java图像界面的学习感悟

    简介 正文 01.JFrame是啥? 02.JPanel 03. KeyListener 04.Runnable 05.游戏Running 06.游戏初始类编写 07.main 简介: 一直以来用代码 ...

  7. Qt 学习之路 2(34):贪吃蛇游戏(4)

    Qt 学习之路 2(34):贪吃蛇游戏(4) 豆子 2012年12月30日 Qt 学习之路 2 73条评论 这将是我们这个稍大一些的示例程序的最后一部分.在本章中,我们将完成GameControlle ...

  8. Qt 学习之路 2(33):贪吃蛇游戏(3)

    Qt 学习之路 2(33):贪吃蛇游戏(3) 豆子 2012年12月29日 Qt 学习之路 2 16条评论 继续前面一章的内容.上次我们讲完了有关蛇的静态部分,也就是绘制部分.现在,我们开始添加游戏控 ...

  9. Qt 学习之路 2(32):贪吃蛇游戏(2)

    Qt 学习之路 2(32):贪吃蛇游戏(2) 豆子 2012年12月27日 Qt 学习之路 2 55条评论 下面我们继续上一章的内容.在上一章中,我们已经完成了地图的设计,当然是相当简单的.在我们的游 ...

随机推荐

  1. xml中Node和Element的区别

    本文转载自:http://blog.csdn.net/wcydiyi/article/details/4432636点击打开链接 1.元素(Element)和结点(Node)的区别:         ...

  2. Linux入门篇(六)——Shell(二)

    这一系列的Linux入门都是本人在<鸟哥的Linux私房菜>的基础上总结的基本内容,主要是记录下自己的学习过程,也方便大家简要的了解 Linux Distribution是Ubuntu而不 ...

  3. 笔记--tslib 编译

    tslib 是qt启动时的一个触屏校正检验程序. 它的配置以及编译比较简单. 第一步, 下载tslib源码包: http://download.csdn.net/detail/MKNDG/329156 ...

  4. node-sass安装不成功的问题

    SASS_BINARY_SITE=https://npm.taobao.org/mirrors/node-sass/ npm install node-sass 简单粗暴的执行上述的命令.

  5. str_replace字符串替换

    字符串替换, src 源字符串, buf_size 缓冲大小, search搜索的字符串大小, repstr 需要替换成的字符串 int str_replace(char *src, unsigned ...

  6. 一些 ssh 小技巧

    本文来自网易云社区. 作者:沈高峰 ssh 经常需要使用的,每次使用都  ssh  abc@XXX.def.com -p 12138 -i ~/.ssh/id_rsa 来一遍显然太麻烦了,下面分享一点 ...

  7. app分享功能开发

    最近在开发一个社交平台的app需要用到分享功能,本来想自己开发的,在网上花了很长时间查了很多教程结果却不尽人意,无意中看到还有类似的开源组件友推,结合自己的开发经验,把一些集成步骤和问题整理成文档奉献 ...

  8. 《Cracking the Coding Interview》——第18章:难题——题目9

    2014-04-29 04:18 题目:有一连串的数被读入,设计一个数据结构,能随时返回当前所有数的中位数. 解法:用一个大顶堆,一个小顶堆将数分成数量最接近的两份,就能轻松得到中位数了. 代码: / ...

  9. Pascal “熊猫烧香”(骗人的)

    Pascal仿熊猫烧香病毒,慎用 program japussy;useswindows, sysutils, classes, graphics, shellapi{, registry};cons ...

  10. Canvas 剪切图片

    /** * 剪切图像 */ function initDemo8(){ var canvas = document.getElementById("demo8"); if (!ca ...