WebSocket的初次使用及调试

Z.TIAN

研究方向

2017年11月17日

大约1.6k字

阅读需11分钟

本页文档最后更新于：2021年7月4日

出现的错误

1	[ERROR] Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.3:compile (default-compile) on project JavaWebSocket: Fatal error compiling: 无效的目标发行版: 1.8 -> [Help 1]

修改：

   <plugin>
    <artifactId>maven-war-plugin</artifactId>
    <version>2.6</version>
    <configuration>
      <warSourceDirectory>WebRoot</warSourceDirectory>
      <failOnMissingWebXml>false</failOnMissingWebXml>
    </configuration>
  </plugin>
  <plugin>
    <artifactId>maven-compiler-plugin</artifactId>
    <version>3.3</version>
    <configuration>
      <source>1.8</source>
      <target>1.8</target>
    </configuration>
  </plugin>

<plugins>
  <plugin>
    <artifactId>maven-war-plugin</artifactId>
  </plugin>
  <plugin>
    <artifactId>maven-compiler-plugin</artifactId>
    <configuration>
      <source>1.6</source>
      <target>1.6</target>
    </configuration>
  </plugin>
</plugins>

此处使用maven自动打包上传的插件

              <plugin>  
			    <groupId>org.codehaus.mojo</groupId>  
			    <artifactId>tomcat-maven-plugin</artifactId>  
			    <version>1.1</version>  
			    <configuration>  
			        <url>http://localhost:9080/manager/text</url>  
			        <server>tomcat8</server>  
			        <username>admin</username>  
			        <password>admin</password>  
			        <ignorePackaging>true</ignorePackaging>    
			    </configuration>  
			</plugin>
```			

**tomcat-users.xml（修改后重启Tomcat）**

1 2	部署的名字与pom.xml开头的配置是一致的

4.0.0 WeeeebSkt WeeeebSkt 0.0.1-SNAPSHOT war

1 2	注意下面的路径+项目名

[INFO] Deploying war to http://localhost:8080/WeeeebSkt [INFO] OK - Deployed application at context path /WeeeebSkt [INFO] ------------------------------------------------------------------------ [INFO] BUILD SUCCESS [INFO] ------------------------------------------------------------------------ [INFO] Total time: 2.045 s [INFO] Finished at: 2017-11-13T13:29:02+08:00 [INFO] Final Memory: 15M/308M [INFO] ------------------------------------------------------------------------

1
2


**果然报错**

(index):20 WebSocket connection to 'ws://localhost:8080/websocket' failed: Error during WebSocket handshake: Unexpected response code: 404

 
 
 **定位前台的出错位置：**
 
 ![image_1bupu08q5hn82aepo61qp31dr09.png-36.3kB][1]
 
 **确认后台的EndPoint：**
 
 ![image_1bupu1ltd8muej0nmn1o6u1cv8m.png-12.5kB][2]
 
 **完全对应，怎么会出错？？？**
 
 **当前环境：**
 
 ![image_1bupu4rg71ee81cps6rod41qs39.png-62.4kB][3]
 
 **项目环境，依赖：**
 
 ![image_1bupu6m1h1ou567jq8k19blcpdm.png-25.3kB][4]
 
 **查找错误：**
 
 更换 Tomcat8.5 + JavaSE-1.8 结果完全一样的错误
 
> j2ee 项目里面是不是设置了拦截器之类的东西，在web.xml中配置的。可能ws协议的请求被拦截器拦截下来了。这方面的问题网络上有很多。
我犯过的一个弱智的错误：在 ws 请求路径中没有写 j2ee 的项目名称。比如我的工程项目叫BoardGame，
var webSocket = new WebSocket('ws://localhost:8080/BoardGame/websocket'); 
//没有 BoardGame 所有一定是找不到的。
 
**修改Tomcat7版本的代码：**

前台代码修改：

if ('WebSocket' in window) { //websocket = new WebSocket("ws://localhost:8080/websocket"); websocket = new WebSocket("ws://localhost:8080/websocket"); }

1 2	错误还是依旧：

WebSocket connection to 'ws://localhost:8080/WeeeebSkt/websocket' failed: Error during WebSocket handshake: Unexpected response code: 404


**修改Tomcat8版本的代码：**

前台代码修改：

if ('WebSocket' in window) { //websocket = new WebSocket("ws://localhost:8080/websocket"); websocket = new WebSocket("ws://localhost:8080/websocket"); }

1 2	已经连接成功：

[CodeLive] HTTP detected: Connecting using WS VM37:109 [CodeLive] Connected to CodeLive at ws://127.0.0.1:8123


通过比较Tomcat7的Webapps中部署的文件来看，和Tomcat8.5中的完全一样，但是，结果是失败的。
之后又尝试了很多修改都是报错。

#### 结论

如果你使用Tomcat7.05以上的版本+J2SE-1.7来尝试websocket时出现404，别找错误了，坑太多，直接更换环境吧，使用Tomcat8以上+J2SE-1.8是完全可行的，已亲测。
 
#### 运行效果

![image_1bupvpea51j8va86v82154jase9.png-142.1kB][5]
 
 
**<<** 更多精彩尽在『程序萌部落』**>>**
**<<** [https://www.cxmoe.com](https://www.cxmoe.com) **>>**
 
#### 下面是相关代码

前台index.jsp中核心的javascript调用：

1 2	#### 后台WebSocket的实现

import java.io.IOException;
import java.util.concurrent.CopyOnWriteArraySet;
import javax.websocket.*;
import javax.websocket.server.ServerEndpoint;

/**

@ServerEndpoint 注解是一个类层次的注解，它的功能主要是将目前的类定义成一个websocket服务器端,
注解的值将被用于监听用户连接的终端访问URL地址,客户端可以通过这个URL来连接到WebSocket服务器端
/
@ServerEndpoint(“/websocket”)
public class Ws {
//静态变量，用来记录当前在线连接数。应该把它设计成线程安全的。
private static int onlineCount = 0;

//concurrent包的线程安全Set，用来存放每个客户端对应的MyWebSocket对象。若要实现服务端与单一客户端通信的话，可以使用Map来存放，其中Key可以为用户标识
private static CopyOnWriteArraySet webSocketSet = new CopyOnWriteArraySet();

//与某个客户端的连接会话，需要通过它来给客户端发送数据
private Session session;

/**
- 连接建立成功调用的方法
- @param session 可选的参数。session为与某个客户端的连接会话，需要通过它来给客户端发送数据
- /
  @OnOpen
  public void onOpen(Session session){
  this.session = session;
  webSocketSet.add(this); //加入set中
  addOnlineCount(); //在线数加1
  System.out.println(“有新连接加入！当前在线人数为” + getOnlineCount());
  }
  
  /**
- 连接关闭调用的方法
- /
  @OnClose
  public void onClose(){
  webSocketSet.remove(this); //从set中删除
  subOnlineCount(); //在线数减1
  System.out.println(“有一连接关闭！当前在线人数为” + getOnlineCount());
  }
  
  /**
- 收到客户端消息后调用的方法
- @param message 客户端发送过来的消息
- @param session 可选的参数
- /
  @OnMessage
  public void onMessage(String message, Session session) {
  System.out.println(“来自客户端的消息:” + message);
  //群发消息
  for(Ws item: webSocketSet){
```
try {
    item.sendMessage(message);
} catch (IOException e) {
    e.printStackTrace();
    continue;
}
```
  }
  }
  
  /**
- 发生错误时调用
- @param session
- @param error
- /
  @OnError
  public void onError(Session session, Throwable error){
  System.out.println(“发生错误”);
  error.printStackTrace();
  }
  }
  1
  2
  
  #### Maven配置：
  4.0.0 JavaWebSocket JavaWebSocket 0.0.1-SNAPSHOT war 3.1 javax.websocket javax.websocket-api 1.0 src maven-compiler-plugin 3.3 1.8 1.8 org.codehaus.mojo tomcat-maven-plugin 1.1 http://localhost:9080/manager/text tomcat8 admin admin true maven-war-plugin 2.6 WebRoot false ```

😒 留下您对该文章的评价 😄

WebSocket的初次使用及调试

出现的错误

一种基于力导向布局的层次结构可视化方法

可视化  节点连接  层次数据  力导向布局

用WebSocket给传统Web系统赋能

WebSocket 可视化  布局算法

评论