WebSocket的简单实现&jsp

创建一个web项目

导入依赖:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>com.chu</groupId>
    <artifactId>webSocket</artifactId>
    <version>1.0-SNAPSHOT</version>
    <packaging>war</packaging>

    <dependencies>
<!--        servlet-api-->
        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>javax.servlet-api</artifactId>
            <version>3.1.0</version>
        </dependency>
<!--        websocket-api-->
        <dependency>
            <groupId>javax.websocket</groupId>
            <artifactId>javax.websocket-api</artifactId>
            <version>1.1</version>
<!--            设置作用域 默认compile 编译 测试 运行
                provided 编译 测试
                runtime 测试 运行
                test 测试-->
            <scope>provided</scope>
        </dependency>
<!--        JSON转换-->
        <dependency>
            <groupId>com.fasterxml.jackson.core</groupId>
            <artifactId>jackson-databind</artifactId>
            <version>2.7.4</version>
        </dependency>
    </dependencies>

<!--    <build>-->
<!--        <plugins>-->
<!--                maven自带的tomcat插件 需要配置对应的命令 tomcat7:run-->
<!--            <plugin>-->
<!--                <groupId>org.apache.tomcat.maven</groupId>-->
<!--                                <artifactId>tomcat7-maven-plugin</artifactId>-->
<!--                                <version>2.2</version>-->
<!--                                <configuration>-->
<!--                                    <port>80</port>-->
<!--                                    <path>/</path>-->
<!--                                    <uriEncoding>UTF-8</uriEncoding>-->
<!--                                </configuration>-->
<!--            </plugin>-->
<!--        </plugins>-->
<!--    </build>-->

</project>

controller层代码:

package com.chu.controller;

import com.fasterxml.jackson.databind.ObjectMapper;
import javax.websocket.*;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.util.HashMap;
import java.util.Map;
/*
小楚想要发送信息给小赵
这个信息会先存储在服务器
再由服务器发送给小赵
 */
@ServerEndpoint("/chat/{name}")
public class ChatSocket {

    //定义一个Map集合,用来存放登陆到服务器的客户名称和Session
    private static Map<String,Session> mapMessage = new HashMap<>();
    
    //首先,方法名称可以自定义
    // *形参---name---Session
    @OnOpen//会话开始
    public void onOpen(@PathParam("name")String name, Session session){
        System.out.println("onOpen....."+name);
        //key-----name  value-----session
        mapMessage.put(name,session);

    }
    //客户机信息处理 * 形参---Session session ---String message
    @OnMessage
    public void onMessage(Session session,String message){
        System.out.println("onMessage....."+message);
        //服务端给客户端发消息,走的不是HTTP 而是直接推送过去了
        //获取JSON对象
        ObjectMapper mapper = new ObjectMapper();
        try {
            //获取JSON格式的信息
            Map<String,String> map = mapper.readValue(message, Map.class);
            //获取需要发送的信息:content
            String content = map.get("content");
            //获取接收信息者:小赵
            String receive = map.get("receive");
            //从事先定义好的Map中获取小赵的Session
            Session receiveSession = mapMessage.get(receive);
            //如果小赵的Session为null
            if(receiveSession==null){
                //响应:对方不在线
                session.getAsyncRemote().sendText("对方不在线");
            }else{
                //否则将接收到的信息发送给小赵
                receiveSession.getAsyncRemote().sendText(content);
            }
        } catch (IOException e) {
            e.printStackTrace();
        }

    }
    //会话结束
    @OnClose
    public void onClose(Session session){
        System.out.println("onClose....."+session);
    }
    //会话出现异常
    @OnError
    public void onError(Session session,Throwable e){
        try {
            e.printStackTrace();
            session.close();
        } catch (IOException ex) {
            ex.printStackTrace();
        }
    }
}

jsp代码:

<body>
<div align="center" style="padding-top: 50px">

    发送者<input id="sendOut"><br>

    接收者<input id="receive"><br>

    信息<input id="content"><br>

    <input type="button" value="注册" onclick="reg()">

    <input type="button" value="提交" onclick="sendmsg()"><br>

    <span id="list"></span>

    <script type="text/javascript">
        var ws;
        // 注册按钮
        function reg() {
            // 注册路径 加上自己的用户名
            ws = new WebSocket("ws://localhost:8080/chat/"+document.getElementById("sendOut").value)
            //接收服务器信息并显示
            ws.onmessage = function (msg) {
                //接收服务器信息
                var message = msg.data
                //获取展示信息的位置
                var former = document.getElementById("list")
                former.innerHTML=former.innerHTML+"...他说"+message
            }
        }
        function sendmsg() {
            // 获取接收者
            var receive = document.getElementById("receive").value
            //获取发送的内容
            var content = document.getElementById("content").value
            //以JSON的方式发送到服务器
            ws.send(‘{"receive":"‘+receive+‘","content":"‘+content+‘"}‘)
            //获取展示信息的位置
            var former = document.getElementById("list")
            former.innerHTML=former.innerHTML+"...你说"+content
        }
    </script>
</div>
</body>