WebSocket 1.0的學習和簡單使用

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中有相關重複的類