小程序Java后端实现websocket与微信小程序端连接简单例子

如何看待微信公开课小程序热门讨论「小程序Java后端实现websocket与微信小程序端连接简单例子」
摘要：小程序Java后端实现websocket与微信小程序端连接简单例子
展开：直接附代码前端代码：%@pagelanguagejavaimportjava.util.pageEncodingUTF8%%Stringpathrequest.getContextPath();StringbasePathrequest.getScheme()+://+request.getServerName()+:+request.getServerPort()+path+/;%!DOCTYPEHTMLhtmlheadbasehref%basePath%titleMyWebSocket/title/headbodyWelcomebr/inputidtexttypetext/buttononclicksend()Send/buttonbuttononclickcloseWebSocket()Close/buttondividmessage/div/bodyscripttypetext/javascriptvarwebsocketnull;//判断当前浏览器是否支持WebSocketif(WebSocketinwindow){websocketnewWebSocket(ws://localhost:8080/myWebSocket/websocket);}else{alert(Notsupportwebsocket)}//连接发生错误的回调方法websocket.onerrorfunction(){setMessageInnerHTML(error);};//连接成功建立的回调方法websocket.onopenfunction(event){setMessageInnerHTML(open);}//接收到消息的回调方法websocket.onmessagefunction(event){setMessageInnerHTML(event.data);}//连接关闭的回调方法websocket.onclosefunction(){setMessageInnerHTML(close);}//监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。window.onbeforeunloadfunction(){websocket.close();}//将消息显示在网页上functionsetMessageInnerHTML(innerHTML){document.getElementById(message).innerHTML+innerHTML+br/;}//关闭连接functioncloseWebSocket(){websocket.close();}//发送消息functionsend(){varmessagedocument.getElementById(text).value;websocket.send(message);}/script/html后端代码：importjava.io.IOException;importjava.util.concurrent.CopyOnWriteArraySet;importjavax.websocket.OnClose;importjavax.websocket.OnError;importjavax.websocket.OnMessage;importjavax.websocket.OnOpen;importjavax.websocket.Session;importjavax.websocket.server.ServerEndpoint;//该注解用来指定一个URI，客户端可以通过这个URI来连接到WebSocket。类似Servlet的注解mapping。无需在web.xml中配置。@ServerEndpoint(/websocket)publicclassMyWebSocket{//静态变量，用来记录当前在线连接数。应该把它设计成线程安全的。privatestaticintonlineCount0;//concurrent包的线程安全Set，用来存放每个客户端对应的MyWebSocket对象。若要实现服务端与单一客户端通信的话，可以使用Map来存放，其中Key可以为用户标识privatestaticCopyOnWriteArraySetMyWebSocketwebSocketSetnewCopyOnWriteArraySetMyWebSocket();//与某个客户端的连接会话，需要通过它来给客户端发送数据privateSessionsession;/连接建立成功调用的方法@paramsession可选的参数。session为与某个客户端的连接会话，需要通过它来给客户端发送数据/@OnOpenpublicvoidonOpen(Sessionsession){this.sessionsession;webSocketSet.add(this);//加入set中addOnlineCount();//在线数加1System.out.println(有新连接加入！当前在线人数为+getOnlineCount());}/连接关闭调用的方法/@OnClosepublicvoidonClose(){webSocketSet.remove(this);//从set中删除subOnlineCount();//在线数减1System.out.println(有一连接关闭！当前在线人数为+getOnlineCount());}/收到客户端消息后调用的方法@parammessage客户端发送过来的消息@paramsession可选的参数/@OnMessagepublicvoidonMessage(Stringmessage,Sessionsession){System.out.println(来自客户端的消息:+message);//群发消息for(MyWebSocketitem:webSocketSet){try{item.sendMessage(message);}catch(IOExceptione){e.printStackTrace();continue;}}}/发生错误时调用@paramsession@paramerror/@OnErrorpublicvoidonError(Sessionsession,Throwableerror){System.out.println(发生错误);error.printStackTrace();}/这个方法与上面几个方法不一样。没有用注解，是根据自己需要添加的方法。@parammessage@throwsIOException/publicvoidsendMessage(Stringmessage)throwsIOException{this.session.getBasicRemote().sendText(message);//this.session.getAsyncRemote().sendText(message);}publicstaticsynchronizedintgetOnlineCount(){returnonlineCount;}publicstaticsynchronizedvoidaddOnlineCount(){MyWebSocket.onlineCount++;}publicstaticsynchronizedvoidsubOnlineCount(){MyWebSocket.onlineCount;}}以上是网上的前端及后端的代码（原文地址：http://www.cnblogs.com/xdpgacl/p/5193279.html？utm_sourcetuicoolutm_mediumreferral），jdk版本要求是在jdk1.7.0以上，tomcat版本也需要在tomcat7.0版本以上。另外有个需要注意的点就是websocket的api包要用tomcat自带的（websocketapi.jar），一开始本人采用的是非tomcat自带的javax.websocketapi1.0.jar包，在配置了正确的环境之后总是连接不上，会报错：ErrorduringWebSockethandshake:Unexpectedresponsecode:404。正确的效果图如下：进入页面http://localhost:8080/myWebSocket/index.jsp输入内容，点击send微信小程序端发起请求：请求代码：connectWebSocket:function(){console.log(创建webSocket连接);wx.connectSocket({url:ws://localhost:8080/myWebSocket/websocket,//url:http://eservicesit.prlife.com.cn:7001,data:{x:,y:},header:{contenttype:application/json},method:GET,success:function(res){console.log(创建连接成功);//dosomething},fail:function(res){console.log(创建连接失败,原因因::+res.errMsg);},complete:function(){console.log(创建连接complete);}})}控制台输出：原作者:郑春宏来自:http://blog.csdn.net/v824394795/article/details/53507645