WebSocket JavaScript API(client)
<script>
var URL = "ws://localhost:8080/WebSocketChatRoom/chatRoomServer";
var websocket;
var userName;
function setConnected(connected) {
document.getElementById('connect').disabled=connected;
document.getElementById('disconnect').disabled = !connected;
document.getElementById('send').disabled = !connected;
}
function connect() {
if('WebSocket' in window){
websocket = new WebSocket(URL);
}else if('MozWebSocket' in window){
websocket = new MozWebSocket(URL);
}else{
alert("您的浏览器不支持WebSocket,请更换最新版本浏览器");
return;
}
websocket.onopen = function (evnt) {
userName = document.getElementById('userId').value;
if(userName == ""){
alert("用户名不能为空");
return;
}else{
setConnected(true);
websocket.send(userName + "加入聊天室");
}
};
websocket.onmessage = function (evnt) {
onMessage(evnt)
};
websocket.onerror = function (evnt) {
onError(evnt)
};
websocket.onclose = function (evnt) {
disconnect(evnt);
}
}
function sendMessage() {
var userName = document.getElementById('userId').value;
var msg = document.getElementById('message').value;
websocket.send(userName+": "+msg);
}
function onMessage(evnt) {
if (typeof evnt.data == "string") {
log(evnt.data);
}
}
function onError(evnt) {
log('错误: ' + evnt.data);
}
/*function onClose(evnt) {
setConnected(false);
}*/
function disconnect(evnt) {
if(websocket != null){
websocket.close(1000, userName + "退出聊天室");
websocket = null;
log("你已退出聊天室");
setConnected(false);
}
}
function log(message) {
var console = document.getElementById('console');
var p = document.createElement('p');
p.style.wordWrap = 'break-word';
p.appendChild(document.createTextNode(message));
console.appendChild(p);
while (console.childNodes.length > 25) {
console.removeChild(console.firstChild);
}
console.scrollTop = console.scrollHeight;
}
</script>
- websocket.onopen #当打开一个新的连接时会调用这个方法
- websocket.onmessage #当server有数据返回时调用
- websocket.send() #向服务端发送信息,类型包括{String|ArrayBuffer|ArrayBufferView|Blob}
- websocket.close() #向服务器发送关闭的请求,参数{number} [code] {string} [reason],附相关代码表,一般使用本方法关闭code为1000,直接关闭浏览器为1006,CLOSE_ABNORMAL
Status code | Name | Description |
0-999 | Reserved and not used. | |
1000 | CLOSE_NORMAL | Normal closure; the connection successfully completed whatever purpose for which it was created. |
1001 | CLOSE_GOING_AWAY | The endpoint is going away, either because of a server failure or because the browser is navigating away from the page that opened the connection. |
1002 | CLOSE_PROTOCOL_ERROR | The endpoint is terminating the connection due to a protocol error. |
1003 | CLOSE_UNSUPPORTED | The connection is being terminated because the endpoint received data of a type it cannot accept (for example, a text-only endpoint received binary data). |
1004 | Reserved. A meaning might be defined in the future. | |
1005 | CLOSE_NO_STATUS | Reserved. Indicates that no status code was provided even though one was expected. |
1006 | CLOSE_ABNORMAL | Reserved. Used to indicate that a connection was closed abnormally (that is, with no close frame being sent) when a status code is expected. |
1007 | The endpoint is terminating the connection because a message was received that contained inconsistent data (e.g., non-UTF-8 data within a text message). | |
1008 | The endpoint is terminating the connection because it received a message that violates it's policy. This is a generic status code, used when codes 1003 and 1009 are not suitable. | |
1009 | CLOSE_TOO_LARGE | The endpoint is terminating the connection because a data frame was received that is too large. |
1010 | The client is terminating the connection because it expected the server to negotiate one or more extension, but the server didn't. | |
1011 | The server is terminating the connection because it encountered an unexpected condition that prevented it from fulfilling the request. | |
1012-1014 | Reserved for future use by the WebSocket standard. | |
1015 | Reserved. Indicates that the connection was closed due to a failure to perform a TLS handshake (e.g., the server certificate can't be verified). | |
1016-1999 | Reserved for future use by the WebSocket standard. | |
2000-2999 | Reserved for use by WebSocket extensions. | |
3000-3999 | Available for use by libraries and frameworks. May not be used by applications. | |
4000-4999 | Available for use by applications. |
WebSocket Java API(Server)
@ServerEndpoint("/chatRoomServer")
public class MessageEndPoint {
private static final ArrayList<Session> sessions;
static {
sessions = new ArrayList<Session>();
}
@OnOpen
public void onOpen(Session session) {
sessions.add(session);
}
@OnMessage
public void onMessage(String message) {
sendMessage(message);
}
@OnClose
public void onClose(Session session,CloseReason closeReason) {
sessions.remove(session);
sendMessage(closeReason.getReasonPhrase());
}
private void sendMessage(String message){
for(Session session : sessions){
try {
session.getBasicRemote().sendText(message);
} catch (IOException e) {
e.printStackTrace();
}
}
}
}
- @ServerEndpoint("/chatRoomServer"),ServerEndpoint把一个POJO类转换成了WebSocket EndPoint,后边的值是访问地址
- 关于注解请看
Annotation | Role |
---|---|
@ServerEndpoint | Declare a Server Endpoint |
@ClientEndpoint | Declare a Client Endpoint |
@OnOpen | Declare this method handles open events |
@OnMessage | Declare this method handles Websocket messages |
@OnError | Declare this method handles error |
@OnClose | Declare this method handles WebSocket close events |
<dependency>
<groupId>javax.websocket</groupId>
<artifactId>javax.websocket-api</artifactId>
<version>1.0</version>
<scope>provided</scope>
</dependency>
我使用的tomcat,<scope>provided</scope>这句一定要加上,否则会报404,tomcat中有相关重复的类