websocket基础使用

用到的依赖包
  • websocket的依赖

    <dependency>
    <groupId>javax.websocket</groupId>
    <artifactId>javax.websocket-api</artifactId>
    <version>1.1</version>
    <scope>provided</scope>
    </dependency>
  • json-lib的依赖

    <dependency>
    <groupId>net.sf.json-lib</groupId>
    <artifactId>json-lib</artifactId>
    <version>2.4</version>
    </dependency>
    服务端代码实现
  • 服务端需要Servlet3.0的注解

    @ServerEndpoint("/websocket/{name}") : 用于标记该类为websocket服务端类

    name用于记录当前websocket是谁,用于区分连接的用户

    servlet是单例对象,websocket是多里对象,因为他需要实时连接,与要知道每个连接是谁

    (解释都在注释里,不多赘述)

    public class WebSocket {
    private String name;//用于记录当前websocket是谁,用于区分连接的用户
    private Session session; //webSocket中的session 链接,用于记录当前的连接 private static Map<String,WebSocket> allClients = new HashMap<>(); public Session getSession(){
    //...
    } public void setSession() {
    //...
    } /**
    *
    * @param name 嗲表地址参数中的name
    * @param session 当前建立的链接
    */
    @OnOpen //标志建立连接的注释
    public void openConnection(@PathParam("name") String name,Session session){
    this.name = name;
    this.session = session;
    allClients.put(name,this);//将name与webSocket绑定
    } /**
    * 当服务器接受到消息时触发
    * @param message
    * @param session 当前建立的链接
    */
    @OnMessage //用于接收客户端发来的消息,这个地方应该根据自己的实际业务需求,来决定到底写什么
    public void onMessage(Session session,String message) {
    //1.首先解析发过来的内容,找到目标接收者:通过名字找到名字对应的websocket对象,获取websocket对象中的session,创建一个固定容器用于存放对应key-value值:String-WebSocket
    JSONObject jsonObject JSONObject.fromObject(message); //与前端约定,接收者为toUser,发送信息内容为toMessage
    String to = jsonObject.getString("toUser");//找到接收者
    String toMessage = jsonObject.getString("toMessage");//获取到发送的内容
    //2.根据目标接收者,找到它的session链接
    WebSocket webSocket = allClients.get(to);//获取到目标接收者的webSocket
    //3.通过session发消息
    if(WebSocket != null){
    Session toSession = webSocket.getSession();//获取到服务器和目标接收者的链接
    if(toSession.isOpen()) {
    //toSession为要发送的目标者,getAsyncRemote获得链接的相对的另一端
    toSession.getAsyncRemote().sendText(toMessage);
    }
    }else {
    //正常来说应该缓存这个消息,这里我就直接发送留言,对方不在线
    session.getAsyncRemote().sendText("对方不在线");
    } } /**
    * 当服务器发生异常时触发
    * @param e 可抛出的异常
    * @param session 哪个链接出现了异常
    */
    @OnError
    public void onError(Session session,Throwable e) { } /**
    * 当链接关闭的时候触发
    * @param e 可抛出的异常
    * @param session 哪个链接出现了异常
    */
    @OnClose
    public void onClose(Session session){ } }
    客户端js代码
    var websocket = null;
    
    //-------------===客户端获取websocekt链接===-----------------
    function connection(){
    var username="";//对应服务端的name TODO:更具具体情况获得一个username用于表示当前的链接
    //首先判断当前浏览器是否支持websocket
    if('WebSocket' in window) {
    //创建websocket
    websocket = new WebSocket("ws://"+document.location.host+"/websocket"+username);
    }else{
    alert('当前浏览器不支持websocket');
    } //建立链接的回调
    websocket.onopen = function() {
    console.log("链接建立了")
    } //收到消息时
    websocket.onmessage = function(event) {
    //获得消息,并打印
    console.log(event.data)
    } websocket.onerror = function() {
    console.log("出现异常了")
    } websocket.onclose = function() {
    console.log("链接关闭了")
    } //当浏览器的页面窗口关闭的时候,此时应该关闭链接,防止服务器出现异常
    window.onbeforeunload = = function() {
    if (websocket!=null){
    websocket.close();
    }
    }
    } //------------==发送消息==-----------
    function sendMessage(){
    //1.获取到发送给谁
    var toUser = "";//Dom操作,此处省略了
    //2.获取到发送的内容
    var toMessage = ""//Dom操作,此处省略了 if(websocket!=null) {
    //拼json串
    var message = "{'toUser':"+toUser+","+"'toMessage':"+toMessage+"}";】
    //发送json串
    websocket.send(message);
    }
    }

通过实现简单聊天室了解websocket的基础使用的更多相关文章

  1. 学习WebSocket(二):使用Spring WebSocket做一个简单聊天室

    聊天室高频率.低延时完全符合websocket的特点,所以聊天室使用websocket再适合不过了. 聊天室的功能并没有比上一节代码多多少,主要在握手阶段对用户的session做处理,对用户的消息进行 ...

  2. SpringBoot 搭建简单聊天室

    SpringBoot 搭建简单聊天室(queue 点对点) 1.引用 SpringBoot 搭建 WebSocket 链接 https://www.cnblogs.com/yi1036943655/p ...

  3. 利用socket.io+nodejs打造简单聊天室

    代码地址如下:http://www.demodashi.com/demo/11579.html 界面展示: 首先展示demo的结果界面,只是简单消息的发送和接收,包括发送文字和发送图片. ws说明: ...

  4. 基于Server-Sent Event的简单聊天室 Web 2.0时代,即时通信已经成为必不可少的网站功能,那实现Web即时通信的机制有哪些呢?在这门项目课中我们将一一介绍。最后我们将会实现一个基于Server-Sent Event和Flask简单的在线聊天室。

    基于Server-Sent Event的简单聊天室 Web 2.0时代,即时通信已经成为必不可少的网站功能,那实现Web即时通信的机制有哪些呢?在这门项目课中我们将一一介绍.最后我们将会实现一个基于S ...

  5. Python Socket 简单聊天室2

    上篇文章写了一个简单的单线程的一问一答的简单聊天室.这次我们使用SocketServer模块搭建一个多线程异步的聊天室. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 ...

  6. Asp.Net SignalR - 简单聊天室实现

    简单聊天室 使用持久链接类我们就可以做一些即时通讯的应用了,我使用Group做了一个简单的聊天室,先上图技术细节下面再讲 可以加入聊天室.创建聊天室.发送消息,下面就说说我是如何通过Group做出来的 ...

  7. ASP.NET SingalR + MongoDB 实现简单聊天室(一):搭建基本框架

    ASP.NET SingalR不多介绍.让我介绍不如看官网,我这里就是直接上源代码,当然代码还是写的比较简单的,考虑的也少,希望各位技友多多提意见. 先简单介绍聊天室功能: 用户加入聊天室,自动给用户 ...

  8. C#实例之简单聊天室(状态管理)

    前言        状态管理是在同一页或不同页的多个请求发生时,维护状态和页信息的过程.因为Web应用程序的通信协议使用了无状态的HTTP协议,所以当客户端请求页面时,ASP.NET服务器端都会重新生 ...

  9. java web利用mvc结构实现简单聊天室功能

    简单聊天室采用各种内部对象不适用数据库实现. 一个聊天室要实现的基本功能是:         1.用户登录进入聊天室, 2.用户发言 3.用户可以看见别人发言 刚才算是简单的需求分析了,现在就应该是进 ...

随机推荐

  1. plague|commence|gymnasium|triumph|jump

    N-COUNT 瘟疫:疫病A plague is a very infectious disease that spreads quickly and kills large numbers of p ...

  2. continuing|offensive

    the fact of something continuing for a long period of timewithout being changed or stopped 连续性,持续性,连 ...

  3. mapreduce.shuffle set in yarn.nodemanager.aux-services is invalid

    15/07/01 20:14:41 FATAL containermanager.AuxServices: Failed to initialize mapreduce.shuffle java.la ...

  4. Nginx笔记总结十六:nginx优化指南

    1.高层的配置 worker_processes 定义了nginx对外提供web服务时的worker进程数 worker_rlimit_nofile 更改worker进程最大打开文件数量限制,如果没有 ...

  5. php--小数点问题

    1.用round去小数点后两位时,有时候会出现很长的小数解决方法 sprintf("%.2f",round($total_fee,2)); 使用sprintf再截取一遍.出现变态小 ...

  6. JSF技术web.xml配置解析

    对Java tutorial-examples中jsf hell1的web.xml配置文件的解析 <?xml version="1.0" encoding="UTF ...

  7. MyBatis学习总结之一对多映射

    1.首先创建2张表:students 和grades create table grades( gid ) primary key, gname varchar() ); create table s ...

  8. MongoDB启动.mongorc.js报错解决方法

    在bin目录下输入./mongo --norc 不去加载.mongorc.js

  9. 全平台Markdown笔记软件——Notable

    简介 The markdown-based note-taking app that doesn't suck. 一款简介.跨平台的本地笔记软件,github地址:https://github.com ...

  10. kubernetes集群中的pause容器

    昨天晚上搭建好了k8s多主集群,启动了一个nginx的pod,然而每启动一个pod就伴随这一个pause容器,考虑到之前在做kubelet的systemd unit文件时有见到: 1 2 3 4 5 ...