- 浏览: 439793 次
- 性别:
- 来自: 苏州
文章分类
最新评论
-
cbo365:
叁陆伍视讯公司的网络摄像机支持RTMP协议,可自定义流媒体服务 ...
nginx+nginx-rtmp-module+ffmpeg搭建流媒体服务器 -
藏在心底:
用HTML5canvas绘制一个圆环形的进度表示 -
mdqy195905:
Java 代码:
package com.wing;
imp ...
JSR356标准Java WebSocket -
redstarofsleep:
dwangel 写道好像可以直接用 apt-get insta ...
ubuntu14.04安装ffmpeg -
dwangel:
好像可以直接用 apt-get install吧
ubuntu14.04安装ffmpeg
早就厌倦了Ajax轮询,一直想试试Web Socket.这次终于体验了一把
这次用的浏览器是Chrome,IE不用提了,不支持,FireFox据说是支持的,但是实际试下来不支持.估计是有自己的API,下次再研究....(以上提到的浏览器都是最新稳定版Chrome15,IE9,Firefox8.0)
开发环境:Eclipse3.7,Jetty8.04
[2012/4/6日更新:Tomcat从7.0.27开始已经支持WebSocket了,http://www.iteye.com/news/24773]
先要说下在Eclipse中配置Jetty,这个着实花了一些时间.
首先,要先安装Jetty插件,不能在Server里搜索,如果直接点下图里的,自动搜到的Jetty插件只支持到6.而要支持Web Socket,Jetty至少要7.
所以,只能通过下面这URL手动安装Jetty插件:
http://download.eclipse.org/jetty/updates/jetty-wtp/development
在Eclipse里安装完Jetty插件后,就要按照Jetty了,Jetty其实不需要安装,下载下来就是一个压缩包,解压了就可以使用,但是不能放在含空格的路径下,比如放在program files目录下就不行,Eclipse里起Jetty就起不来.
还没完...,看一下Jetty的lib目录,里面除了Jar包,还有很多文件夹,这些文件夹里面还是Jar包.本来呢这也没什么,但是在Eclipse里就悲剧了,它认不出来,不知道是插件的问题还是Eclipse本身的问题.要解决这个问题就得把那些文件夹里的Jar包拷出来,直接放在Jetty的lib目录下.这样经过改装的Jetty,终于可以在Eclipse里启动了.
要使用WebSocket,光能在Eclipse中启动Jetty是不够的,还需要导入一个Jar包,把Jetty中lib下的jetty-websocket-8.0.4.v20111024.jar拷贝到项目的lib下.
这样子就有了2个Jetty,一个是直接解压出来的原版Jetty,如果要部署war包,就用这个.另一个是经过改装的,专用于Eclipse里调试.
真够麻烦的,Jetty终于搞定了.还是Tomcat方便,可惜Tomcat到7为止没有支持Web Socket.
搞定了Web服务器,现在可以开始写一些代码了.
顺着上面的,先来看服务器端的代码:
服务器端要提供Websocket就需要实现OnTextMessage,实现其中的三个方法:onOpen(),onMessage()和onClose().
onOpen在一个客户端连上来的时候调用
onClose在客户端断开时调用
onMessage在客户端发送消息时调用
除了这个Socket类之外,还需要一个Servlet来接收客户端请求,这个Servlet也不是传统的Servlet(要是传统的Servlet就可以用Tomcat咯),这个Servlet需要继承WebSocketServlet.
服务器端需要做的基本就这么多,接下来是前端HTML
与服务器端类似
首先需要实例化一个WebSocket对象,然后定义它的onOpen,onClose方法.需要发送消息时调用send方法.
下面,贴一下聊天室的代码:
首先有一个普通的Servlet执行初始化,主要是定义一个List,用户存放WebSocket对象:
public class InitServlet extends HttpServlet { private static final long serialVersionUID = -1936532122758235837L; private static List<MyWebSocket> socketList; public void init(ServletConfig config) throws ServletException { InitServlet.socketList = new ArrayList<MyWebSocket>(); super.init(config); System.out.println("Server start============"); } public static synchronized List<MyWebSocket> getSocketList() { return InitServlet.socketList; } }
然后写一个Servlet处理请求,这个Servlet就返回一个WebSocket对象:
public class MyWebSocketServlet extends WebSocketServlet { private static final long serialVersionUID = -7302427588920888589L; @Override public WebSocket doWebSocketConnect(HttpServletRequest request, String arg1) { return new MyWebSocket(); } }
最后实现WebSocket,循环InitServlet中的List,给所有客户端发送消息:
public class MyWebSocket implements OnTextMessage { private Connection conn; /* (non-Javadoc) * @see org.eclipse.jetty.websocket.WebSocket#onClose(int, java.lang.String) * 一个客户端断开时,从List中移除 */ @Override public void onClose(int arg0, String arg1) { InitServlet.getSocketList().remove(this); System.out.println("onClose=========================="); } /* (non-Javadoc) * @see org.eclipse.jetty.websocket.WebSocket#onOpen(org.eclipse.jetty.websocket.WebSocket.Connection) * 一个客户端连上来时,将它加入List */ @Override public void onOpen(Connection conn) { // 如果客户端在这个MaxIdleTime中都没有活动,则它会自动结束 System.out.println("onOpen=========================="+conn.getMaxIdleTime()); this.conn = conn; InitServlet.getSocketList().add(this); } /* (non-Javadoc) * @see org.eclipse.jetty.websocket.WebSocket.OnTextMessage#onMessage(java.lang.String) * 一个客户端发送数据后,触发它自己的onMessage方法,在这个方法里给所有在线的客户端发送这条消息 */ @Override public void onMessage(String data) { System.out.println("~~~~~~~~~~" + data); List<MyWebSocket> socketList = InitServlet.getSocketList(); for (MyWebSocket socket : socketList) { try { socket.getConn().sendMessage(data); } catch (IOException e) { e.printStackTrace(); } } } public Connection getConn() { return conn; } public void setConn(Connection conn) { this.conn = conn; } }
好,服务器端代码展示完毕,接下来是前端HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK"> <title>Chart</title> <script type="text/javascript" src="../../js/jquery-1.7.1.min.js"></script> <script type="text/javascript"> var ws = null; function startWebSocket() { if (!window.WebSocket) alert("WebSocket not supported by this browser!"); // 创建WebSocket ws = new WebSocket("ws://localhost:8080/html5chart/mywebsocket.do"); // 收到消息时在消息框内显示 ws.onmessage = function(evt) { $('#msgBox').append(evt.data); $('#msgBox').append('</br>'); }; // 断开时会走这个方法 ws.onclose = function() { alert('close~~~~~~~'); }; // 连接上时走这个方法 ws.onopen = function() { alert('open~~~~~~~~'); }; } // 发送消息 function sendMsg() { var data = document.getElementById('msgSendBox').value; ws.send(data); document.getElementById('msgSendBox').value = ''; } </script> </head> <body onload="startWebSocket();"> <div id="msgBox" style="width:400px;height:300px;border:1px solid #000000"> </div> <textarea id="msgSendBox" rows="5" cols="32"></textarea> <input type="button" value="send" onclick="sendMsg()"></input> </body> </html>
最后附上web.xml
<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5"> <display-name>html5test</display-name> <welcome-file-list> <welcome-file>index.html</welcome-file> </welcome-file-list> <servlet> <servlet-name>initServlet</servlet-name> <servlet-class>lhc.init.InitServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <servlet> <servlet-name>mywebsocket</servlet-name> <servlet-class>lhc.websocket.MyWebSocketServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>mywebsocket</servlet-name> <url-pattern>*.do</url-pattern> </servlet-mapping> </web-app>
至此,一个具有基础功能的基于HTML5 Web Socket的简陋聊天室就做完了.
评论
调用第一段代码里的public static synchronized List<MyWebSocket> getSocketList()方法.
然后就可以getConn,再sendMessage
报错显示在new websocket()这里
你是页面报错还是后台报错啊
你好LZ,new websocket() 后太有错:
java.lang.NullPointerException at
org.eclipse.jetty.websocket.WebSocketFactory.upgrade(WebSocketFactory.java:215)
请帮忙解答,谢谢
jetty是什么版本的呢?
是jetty8.1.5
后台有报错吗
我用jetty8.04版本来作test,打成war包,运行时没有报错。
用eclipse插件启动时,握手协议时这样的:
Request URL:ws://localhost:8080/jetty/aa.do
Request Method:GET
Status Code:101 Switching Protocols
Request Headersview source
Connection:Upgrade
Host:localhost:8080
Origin:http://localhost:8080
Sec-WebSocket-Extensions:x-webkit-deflate-frame
Sec-WebSocket-Key:IZSDhv0ZAy42/J3aFXV/cg==
Sec-WebSocket-Version:13
Upgrade:websocket
(Key3):00:00:00:00:00:00:00:00
Response Headersview source
Connection:Upgrade
Sec-WebSocket-Accept:ITVdBt/V9b/j9soMSuUyOiQcm/U=
Upgrade:WebSocket
(Challenge Response):00:00:00:00:00:00:00:00:00:00:00:00:00:00:00:00
打成war之后,握手协议时这样的:
Request URL:ws://localhost:8080/jetty/aa.do
Request Headersview source
Connection:Upgrade
Host:localhost:8080
Origin:http://localhost:8080
Sec-WebSocket-Extensions:x-webkit-deflate-frame
Sec-WebSocket-Key:pToY0u0aYVFz2CdjCQfmLA==
Sec-WebSocket-Version:13
Upgrade:websocket
(Key3):00:00:00:00:00:00:00:00
是不是Sec-WebSocket-Key这里的问题?
后面的少了些东西?
Request Method:GET
Status Code:101 Switching Protocols
Request Headersview source
jetty是什么版本的呢?
是jetty8.1.5
后台有报错吗
我用jetty8.04版本来作test,打成war包,运行时没有报错。
用eclipse插件启动时,握手协议时这样的:
Request URL:ws://localhost:8080/jetty/aa.do
Request Method:GET
Status Code:101 Switching Protocols
Request Headersview source
Connection:Upgrade
Host:localhost:8080
Origin:http://localhost:8080
Sec-WebSocket-Extensions:x-webkit-deflate-frame
Sec-WebSocket-Key:IZSDhv0ZAy42/J3aFXV/cg==
Sec-WebSocket-Version:13
Upgrade:websocket
(Key3):00:00:00:00:00:00:00:00
Response Headersview source
Connection:Upgrade
Sec-WebSocket-Accept:ITVdBt/V9b/j9soMSuUyOiQcm/U=
Upgrade:WebSocket
(Challenge Response):00:00:00:00:00:00:00:00:00:00:00:00:00:00:00:00
打成war之后,握手协议时这样的:
Request URL:ws://localhost:8080/jetty/aa.do
Request Headersview source
Connection:Upgrade
Host:localhost:8080
Origin:http://localhost:8080
Sec-WebSocket-Extensions:x-webkit-deflate-frame
Sec-WebSocket-Key:pToY0u0aYVFz2CdjCQfmLA==
Sec-WebSocket-Version:13
Upgrade:websocket
(Key3):00:00:00:00:00:00:00:00
是不是Sec-WebSocket-Key这里的问题?
jetty是什么版本的呢?
是jetty8.1.5
后台有报错吗
同样的问题
jetty是什么版本的呢?
是jetty8.1.5
jetty是什么版本的呢?
ws = new WebSocket("ws://localhost:8080/cometLongPolling/MyWebSocket");
每次打开都是alert出close~~~
这个是什么原因呢?
Firefox是:new MozWebSocket("");
在另一篇里有提到:http://redstarofsleep.iteye.com/blog/1488639
可以留下你的联系方式吗,这样可以方便交流一下,我的QQ429256840,方便的话加一下,谢谢
ws = new WebSocket("ws://localhost:8080/cometLongPolling/MyWebSocket");
每次打开都是alert出close~~~
这个是什么原因呢?
Firefox是:new MozWebSocket("");
在另一篇里有提到:http://redstarofsleep.iteye.com/blog/1488639
ws = new WebSocket("ws://localhost:8080/cometLongPolling/MyWebSocket");
每次打开都是alert出close~~~
这个是什么原因呢?
报错显示在new websocket()这里
你是页面报错还是后台报错啊
报错显示在new websocket()这里
谢谢
这个工程所有的代码我都贴上来了啊....你哪里报错吗?
Firefox中是:window.MozWebSocket
多谢,我试试
发表评论
-
JSR356标准Java WebSocket
2013-11-14 11:16 15327文章搬至CSDN, 最新内容请访问: http://blo ... -
用HTML5canvas绘制一个圆环形的进度表示
2013-08-02 10:05 21628文章搬至CSDN, 最新内 ... -
另类的package-info.java文件探讨 [转]
2012-08-31 10:03 1488翻看以前的笔记,看到一个特殊的java文件:pacak ... -
Javascript面向对象之:一.创建类
2012-05-09 16:53 1055Javascript语言到目前为止,本身并没有提供类似于cla ... -
知识点整理之Java的Cookie操作
2012-05-07 10:17 3448创建Cookie // new一个Cookie对象,键值对为 ... -
知识点整理之Java获取MD5或者SHA
2012-05-02 11:00 1127获取MD5或者是SHA是经常需要用到的功能. ... -
基于Tomcat的WebSocket(5月8日更新)
2012-04-17 17:05 598472014年2月更新: 此API为Tomcat私有,当时Ja ... -
知识点整理之Java时间格式化
2012-02-16 16:43 950Calendar rightNow = Calendar.ge ... -
知识点整理之Web项目中Log4J的初始化
2012-02-07 08:45 1550首先在web.xml中定义一个servlet,执行初始化 & ... -
知识点整理之Java Socket
2012-01-21 15:01 1278依旧是自己平时用到的一些东西的整理 Socket客户端 ... -
知识点整理之SessionListener监控Session的创建与销毁
2012-01-20 16:46 1457纯粹是以前用到的东西的一点记录,怕自己忘了。 用Lis ... -
表格表头固定,内容多时滚动内容(2)[改进版]
2011-12-31 15:52 2511之前写过一个,把表头的固定,内容多时滚动内容:http://r ... -
引入CSS 的两种方式:link和@import的区别[转]
2011-09-20 09:43 1370引入css 外部文件的两种方法为在html页面通过link ... -
Java对称与非对称加密解密,AES与RSA
2011-09-13 23:22 12707加密技术可以分为对称 ... -
请求转发与重定向的区别[转]
2011-09-13 11:23 1008一、调用方式 我们知道,在servlet中调用转 ... -
HttpClient的基础应用
2011-09-09 08:54 5068HttpClient是用来发送HTTP请求的,也就是HTTP的 ... -
Java文件过滤
2011-09-06 09:33 1654Java实现文件过滤的方法,比如我只想获得某个路径下.java ... -
纯JS网页上的动态折线图
2011-07-03 23:05 7785用Javascript写了一个网页 ... -
JS画线,虽然很原始,但是兼容所有浏览器
2011-06-29 10:31 14792用Javascript画线的方法很多,有SVG,VML、can ... -
Java正则表达式入门[转]
2011-06-28 11:25 892众所周知,在程序开发中,难免会遇到需要匹配、查找、替换、判断字 ...
相关推荐
基于java Websocket开发的网页聊天工具,曾用于本人课程设计,在此放出造福大家
基于Springboot+Websocket的简单聊天室 基于Springboot+Websocket的简单聊天室 基于Springboot+Websocket的简单聊天室 基于Springboot+Websocket的简单聊天室 基于Springboot+Websocket的简单聊天室 基于Springboot+...
基于jetty8的websocket提炼的能跑的demo
jetty html5 websocket服务器
基于websocket的聊天室。可同时支持多人在线聊天。
需要修改conn/conn.php的配置文件,还需要安装node.js环境,...基于websocket的即时聊天室网站源码 环境: php5.5 mysql node.js 教程视频下载: 链接:https://pan.baidu.com/s/1fjZw2L01-o74EYlw-OaT1A 提取码:3h2p
基于springboot发布的websocket简易聊天室,前后台的websocket交互
使用Netty构建一个基于WebSocket的聊天室服务器。可以使多个用户使用浏览器可以同时进行相互通信。 程序逻辑: 1、客户端发送一个消息; 2、该消息将被广播到所有其他连接的客户端 服务端启动后,浏览器输入...
主要介绍了基于vue和websocket的多人在线聊天室,需要的朋友可以参考下
项目可以直接导入,一个基于Tomcat7、Java、Ext、WebSocket的聊天室,分数是3分,目的不是为了赚分,是为了大家能够评论,提出意见。
websocketClient:客户端,主要包含页面程序及websocket链接 websocketServer:服务端,主要用于链接及操作数据库 主要功能: 登录 注册 上线提醒 下线提醒 消息发送 群发消息 使用说明:由于session机制的...
基于websocket实现的网页版聊天室,包括私聊和多对多聊天,简单易懂,一个jsp页面,一个config.class以及一个websocket.class
UNIAPP实现的聊天功能,聊天室,暂时是1对1,业务请自行写。后台java,websocket,springboot,前端为uniapp
Tomcat7 Ext4. WebSocket 聊天室,经过优化的,具有详细注释的,学习WebSocket的经典例子。
springboot集成websocket实现聊天室功能(可多人聊天和单独聊天)
完整的文档,代码,一步步说明使用WEBSOCKET搭建聊天室。
我是基于springboot+websocket,首先,简历websocket服务端,然后在页面进行调用,通过传参告诉服务端你要在哪个聊天室聊天,等等 ,具体的 看我的实现代码。这还是最基础的,中间可以加一些消息件
HTML5 websocket 聊天 java tomcat8
unity websocket 案例 即时通讯案例,适用各个平台包括webgl unity聊天室 包含服务端与客户端
html5 websocket聊天程序