jfinal html5,Jfinal框架整合webSocket技术功能实现

技术难度：简单

在这里我会用最简单的方法实现JFinal框架结合webSocket最基础的功能，以至于后续业务的拓展需要小伙伴们依据实际情况去实现相应的开发！

废话不多说，直接上代码！

1、编写webSocket类

package morality.ws;

import java.io.IOException;

import javax.websocket.OnClose;

import javax.websocket.OnError;

import javax.websocket.OnMessage;

import javax.websocket.OnOpen;

import javax.websocket.Session;

import javax.websocket.server.ServerEndpoint;

@ServerEndpoint("/ws/getsingle")

public class webSocket {

private Session session;

@OnOpen

public void onOpen(Session session) {

this.session = session;

}

/**

* 收到客户端消息时触发

* @param relationId

* @param userCode

* @param message

* @return

* @throws IOException

* @throws InterruptedException

*/

@OnMessage

public void onMessage(Session session, String key) throws IOException {

//向客户端返回发送过来的消息

session.getBasicRemote().sendText(key);

}

/**

* 异常时触发

* @param relationId

* @param userCode

* @param session

*/

@OnError

public void onError(Throwable throwable,Session session) {}

/**

* 关闭连接时触发

* @param relationId

* @param userCode

* @param session

*/

@OnClose

public void onClose(Session session) {}

}

2、编写Handler

package morality.handler;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import com.jfinal.handler.Handler;

public class WebSockethandler extends Handler {

@Override

public void handle(String target, HttpServletRequest request,HttpServletResponse response, boolean[] isHandled) {

// TODO Auto-generated method stub

if(target.indexOf("/ws/getsingle") == -1){

next.handle(target, request, response, isHandled);

}

}

}

JFinal将不再处理带有“/ws/getsingle”的请求，交由webSocket处理；

3、配置Config

@Override

public void configHandler(Handlers me) {

// TODO Auto-generated method stub

me.add(new WebSockethandler());

}

4、HTML页面

Java后端WebSocket的Tomcat实现

Welcome

发送消息

---

关闭WebSocket连接

---

var websocket = null;

//判断当前浏览器是否支持WebSocket

if ('WebSocket' in window) {

websocket = new WebSocket("ws://localhost:8080/ws/getsingle");

}

else {

alert('当前浏览器 Not support websocket')

}

//连接发生错误的回调方法

websocket.onerror = function () {

setMessageInnerHTML("WebSocket连接发生错误");

};

//连接成功建立的回调方法

websocket.onopen = function () {

setMessageInnerHTML("WebSocket连接成功");

}

//接收到消息的回调方法

websocket.onmessage = function (event) {

setMessageInnerHTML(event.data);

}

//连接关闭的回调方法

websocket.onclose = function () {

setMessageInnerHTML("WebSocket连接关闭");

}

//监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。

window.onbeforeunload = function () {

closeWebSocket();

}

//将消息显示在网页上

function setMessageInnerHTML(innerHTML) {

document.getElementById('message').innerHTML += innerHTML + '
';

}

//关闭WebSocket连接

function closeWebSocket() {

websocket.close();

}

//发送消息

function send() {

var message = document.getElementById('text').value;

websocket.send(message);

}

那如果一切顺利的话你将看到如下页面：

webSocket连接成功

接下来你就可以在input框内输入内容，点击‘发送消息’，内容将显示在页面上：

成功

好啦！小伙伴们，这样一个简单的webSocket+Jfinal就搭建成功啦，快来试试吧！