重庆分公司
重庆分公司，新征程启航
为企业提供网站建设、域名注册、服务器等服务
HTML5：WebSocket实现
搞定这个的过程远比想象的困难许多。网上许多教程，一一尝试，大多随着库版本的改变以及浏览器对协议支持的改变以失败告终，即使成功的也语焉不详，以下为步骤。
创新互联公司专注于响水企业网站建设,响应式网站开发,商城建设。响水网站建设公司,为响水等地区提供建站服务。全流程定制设计，专业设计，全程项目跟踪，创新互联公司专业和态度为您提供的服务
1. 运行环境
Java EE IDE
apache-tomcat-7.0.29(7.0.27之后才支持websocket)
IE(版本：10.0.9200.16384)
Firefox(版本：15.0)
Google Chrome(版本：23.0.1251.2)
2. 详细步骤
(1) 在Java EE IDE中，File->New->Dynamic Web Project，使其如下配置
Target runtime中必须是Apache Tomcat v7.0,并且最好是引用7.0.29(可在New Runtime中配置)
注意，点击Next->,再点击Next->,如下图，注意勾选Generate web.xml deployment descriptor，点击Finish
(2) 在Java Resources下src下New->Class,如下图
再在src下New->Class,如下图
下面贴上上述类的代码
package com.trump.web.servlet;
import java.util.ArrayList;
import java.util.List;
import java.util.logging.Logger;
import javax.servlet.http.HttpServletRequest;
import org.apache.catalina.websocket.StreamInbound;
import org.apache.catalina.websocket.WebSocketServlet;
public class EchoServlet extends WebSocketServlet {
private static final long serialVersionUID = -4104682919545889813L;
private Logger logger = Logger.getLogger(EchoServlet.class.getName());
private static List socketList = new ArrayList();
@Override
protected StreamInbound createWebSocketInbound(String subProtocol,
HttpServletRequest request) {
// TODO Auto-generated method stub
logger.info("receive ws request");
return new MyMessageInbound();
}
public static synchronized List getSocketList() {
return socketList;
}
} package com.trump.web.servlet;
import java.io.IOException;
import java.nio.ByteBuffer;
import java.nio.CharBuffer;
import java.util.logging.Logger;
import org.apache.catalina.websocket.MessageInbound;
import org.apache.catalina.websocket.WsOutbound;
public class MyMessageInbound extends MessageInbound {
private int userIdName = 0;
private Logger logger = Logger.getLogger(MyMessageInbound.class.getName());
public int getUserIdName() {
return userIdName;
}
protected void onOpen(WsOutbound outbound) {
super.onOpen(outbound);
userIdName = outbound.hashCode();
EchoServlet.getSocketList().add(this);
logger.info("Server onOpen");
}
protected void onClose(int status) {
EchoServlet.getSocketList().remove(this);
super.onClose(status);
logger.info("Server onClose");
}
// 有二进制消息数据到达，比如音频等文件传输
@Override
protected void onBinaryMessage(ByteBuffer buffer) throws IOException {
logger.info("Binary Message Receive: " + buffer.remaining());
}
@Override
protected void onTextMessage(CharBuffer buffer) throws IOException {
String msgOriginal = buffer.toString();
int startIndex = msgOriginal.indexOf("!@#$%");
String nikeName = msgOriginal.substring(0, startIndex);
String textMsg = msgOriginal.substring(startIndex + 5);
// 将字符数组包装到缓冲区中
// 给定的字符数组将支持新缓冲区；即缓冲区修改将导致数组修改，反之亦然
String countMsg = EchoServlet.getSocketList().size() + "人同时在线";
logger.info("Server onTextMessage: " + countMsg + nikeName + ":"
+ textMsg);
String msg1 = nikeName + ": " + textMsg;
String msg2 = "我: " + textMsg;
for (MyMessageInbound messageInbound : EchoServlet.getSocketList()) {
CharBuffer msgBuffer1 = CharBuffer.wrap(msg1);
CharBuffer msgBuffer2 = CharBuffer.wrap(msg2);
WsOutbound outbound = messageInbound.getWsOutbound();
if (messageInbound.getUserIdName() != this.getUserIdName()) {
outbound.writeTextMessage(msgBuffer1);
outbound.flush();
} else {
outbound.writeTextMessage(msgBuffer2);
}
}
}
}(3) 打开WebContent下WEB-INF下web.xml,编辑为
myWebSocket index.html index.htm index.jsp default.html default.htm default.jsp echo com.trump.web.servlet.EchoServlet echo *.ws
(4) 右击项目myWebSocket->Run As->Run on Server,如下图，点击Finish,
可以看到Tomacat正常运行，如下图
(5) 在任意位置新建一个客户端，命名为client.html,内容如下
Web Socket Demo
(6) OK!打开浏览器，输入http://localhost:8080/webSocketTest/client.html
此时注意Tomcat打印出的信息，如下
3. WebSocket之所以受关注，是因为它的服务器端能主动发消息给客户端，即MyMessageInbound中onOpen函数可以让服务器做想做的事情。
新闻标题：HTML5：WebSocket实现
分享地址：http://cqcxhl.com/article/iicsed.html