WebSocket简介

WebSocket是HTML5开始提供的一种浏览器与服务器间进行全双工通讯的网络技术。依靠这种技术可以实现客户端和服务器端的长连接，双向实时通信。
特点:
事件驱动
异步
使用ws或者wss协议的客户端socket

能够实现真正意义上的推送功能

缺点：

少部分浏览器不支持，浏览器支持的程度与方式有区别。

下面进行代码和图解:

我现在使用idea进行创建一个项目,下面会给实例项目

简单介绍WebSocket客户端服务器端

WebSocket客户端

websocket允许通过JavaScript建立与远程服务器的连接，从而实现客户端与服务器间双向的通信。在websocket中有两个方法：　　
　　　　1、send() 向远程服务器发送数据
　　　　2、close() 关闭该websocket链接
　　websocket同时还定义了几个监听函数　　　　
　　　　1、onopen 当网络连接建立时触发该事件
　　　　2、onerror 当网络发生错误时触发该事件
　　　　3、onclose 当websocket被关闭时触发该事件
　　　　4、onmessage 当websocket接收到服务器发来的消息的时触发的事件，也是通信中最重要的一个监听事件。msg.data
　　websocket还定义了一个readyState属性，这个属性可以返回websocket所处的状态：
　　　　1、CONNECTING(0) websocket正尝试与服务器建立连接
　　　　2、OPEN(1) websocket与服务器已经建立连接
　　　　3、CLOSING(2) websocket正在关闭与服务器的连接
　　　　4、CLOSED(3) websocket已经关闭了与服务器的连接

　　websocket的url开头是ws，如果需要ssl加密可以使用wss，当我们调用websocket的构造方法构建一个websocket对象（new WebSocket(url)）的之后，就可以进行即时通信了。

我使用的是idea进行演示

简单的聊天

客户端代码如下:

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width" />

    <title>聊天室</title>

</head>

<style>

    body{text-align: center;}

    #div1{width:802px;height: 500px;border:1px solid red;margin: auto}

    #cs{width:650px;height: 350px;border:1px solid red;float: left;}

    #cs2{width: 148px;height: 350px;border: 1px solid red;float: left;}

    p{text-align: left}

    #ss{    height: 109px;

        width: 796px;}

    #cs,#cs2{OVERFLOW: auto;}

    #btnSend{float: right;width: 100px;height: 30px;}

</style>

<body>

<h2>小小聊天室</h2>

<input type="button" id="btnConnection" value="打开连接" />

<input type="button" id="btnClose" value="关闭连接" />

<div id="div1">

    <div id="cs" ></div>

    <div id="cs2"></div>

    <textarea id="ss"></textarea>

   <br/> <input type="button" id="btnSend" value="发送" />

</div>

<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>

<script type="text/javascript">

    var socket;

    if(typeof(WebSocket) == "undefined") {

        console.log("您的浏览器不支持WebSocket");

    }

    $("#btnSend").attr("disabled","disabled");//禁用

    $("#btnClose").attr("disabled","disabled");//禁用

    var name;

    $("#btnConnection").click(function() {

       name= prompt("请输入发送的名称:");

        if(name!=null){

            $("#btnConnection").attr("disabled","disabled");//禁用

            //实现化WebSocket对象，指定要连接的服务器地址与端口

            //socket = new WebSocket("ws://169.254.105.218:8080/ws/"+name);

            //本机

            socket = new WebSocket("ws://localhost/ws/"+name);

            //打开事件

            socket.onopen = function() {

                $("#btnSend").attr("disabled","");//禁用

                $("#btnClose").attr("disabled","");//禁用

                $("#cs2").append($("<p/>").html(name+"：连接成功"));

            };

            //获得消息事件

            socket.onmessage = function(msg) {

                $("#cs").append($("<p/>").html(msg.data));

            };

            //关闭事件

            socket.onclose = function() {

                $("#btnSend").attr("disabled","disabled");//禁用

                $("#btnConnection").attr("disabled","");//禁用

                $("#btnClose").attr("disabled","disabled");//禁用

                $("#cs2").append($("<p/>").html(name+"：已关闭"));

            };

            //发生了错误事件

            socket.onerror = function() {

                $("#cs2").append($("<p/>").html("已关闭发生了错误"));

            }

        }

    });

    //发送消息

    $("#btnSend").click(function() {

        socket.send(document.getElementById("ss").value);

        $("#ss").val("");

    });

    //关闭

    $("#btnClose").click(function() {

        socket.close();

    });

</script>

</body>

</html>

WebSocket服务器端

JSR356定义了WebSocket的规范，Tomcat7中实现了该标准。JSR356 的 WebSocket 规范使用 javax.websocket.*的 API，可以将一个普通 Java 对象（POJO）使用 @ServerEndpoint 注释作为 WebSocket 服务器的端点。

服务器代码如下:

package com;

import java.io.IOException;

import java.util.HashMap;

import java.util.HashSet;

import java.util.Map;

import java.util.Set;

import javax.websocket.CloseReason;

import javax.websocket.OnClose;

import javax.websocket.OnError;

import javax.websocket.OnMessage;

import javax.websocket.OnOpen;

import javax.websocket.Session;

import javax.websocket.server.PathParam;

import javax.websocket.server.ServerEndpoint;

@ServerEndpoint("/ws/{user}")

public class SServlet {

    private String currentUser;

    private static Set<Session> sessions = new HashSet<>();

    //连接打开时执行

    @OnOpen

    public void onOpen(@PathParam("user") String user, Session session) {

        currentUser = user;

        //System.out.println("Connected ... " + session.getId());

        sessions.add(session);

        System.out.println(user);

    }

    //收到消息时执行

    @OnMessage

    public String onMessage(String message, Session session) throws IOException {

        System.out.println(currentUser + "：" + message);

        //发送给所有人

        for (Session s : sessions) {

            if (s.isOpen()) {

                s.getBasicRemote().sendText(currentUser+"说:"+message);

            }

        }

        return null;

    }

    //连接关闭时执行

    @OnClose

    public void onClose(Session session, CloseReason closeReason) {

        System.out.println(String.format("Session %s closed because of %s", session.getId(), closeReason));

    }

    //连接错误时执行

    @OnError

    public void onError(Throwable t) {

        t.printStackTrace();

    }

}

需要引用websocket包：官网地址：https://mvnrepository.com/artifact/javax.websocket/javax.websocket-api

或者直接下载

项目实例和包地址:https://github.com/weibanggang/Message_push

高手教师详细(果哥):https://www.cnblogs.com/best/p/5695570.html

WebSocket消息推送(实现进行聊天)和WebSocket简介的更多相关文章

  1. 【WebSocket】WebSocket消息推送

    准备使用WebSocket实现Java与Vue或者安卓间的实时通信,实现私密聊天.群聊.查询下资料备用. WebSocket客户端 websocket允许通过JavaScript建立与远程服务器的连接 ...

  2. node.js Websocket消息推送---GoEasy

    Goeasy, 它是一款第三方推送服务平台,使用它的API可以轻松搞定实时推送!个人感觉goeasy推送更稳定,推送 速度快,代码简单易懂上手快 浏览器兼容性:GoEasy推送 支持websocket ...

  3. C(++) Websocket消息推送---GoEasy

    Goeasy, 它是一款第三方推送服务平台,使用它的API可以轻松搞定实时推送!个人感觉goeasy推送更稳定,推送 速度快,代码简单易懂上手快 浏览器兼容性:GoEasy推送 支持websocket ...

  4. SSE(Server-sent events)技术在web端消息推送和实时聊天中的使用

    最近在公司闲着没事研究了几天,终于搞定了SSE从理论到实际应用,中间还是有一些坑的. 1.SSE简介 SSE(Server-sent events)翻译过来为:服务器发送事件.是基于http协议,和W ...

  5. websocket消息推送实现

    一.服务层 package com.demo.websocket; import java.io.IOException; import java.util.Iterator; import java ...

  6. WebSocket消息推送

    WebSocket协议是基于TCP的一种新的网络协议,应用层,是TCP/IP协议的子集. 它实现了浏览器与服务器全双工(full-duplex)通信,客户端和服务器都可以向对方主动发送和接收数据.在J ...

  7. spring boot下WebSocket消息推送(转)

    原文地址:https://www.cnblogs.com/betterboyz/p/8669879.html WebSocket协议 WebSocket是一种在单个TCP连接上进行全双工通讯的协议.W ...

  8. spring+rabbitmq+stomp搭建websocket消息推送（非spring boot方式）

    前言: 两年前做过spring+activemq+stomp的ws推送,那个做起来很简单,但现在公司用的mq中间件是rabbitmq,因此需要通过rabbitmq去做ws通信.仔细搜了搜百度/谷歌,网 ...

  9. spring boot下WebSocket消息推送

    WebSocket协议 WebSocket是一种在单个TCP连接上进行全双工通讯的协议.WebSocket通信协议于2011年被IETF定为标准RFC 6455,并由RFC7936补充规范.WebSo ...

随机推荐

  1. jQuery遍历祖先元素：parentsUntil

    Description: Get the ancestors of each element in the current set of matched elements, up to but not ...

  2. React.js 小书 Lesson12 - state vs props

    作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson12 转载请注明出处,保留原文链接和作者信息. 我们来一个关于 state 和 props 的 ...

  3. HDU 1754——I Hate It——————【线段树单点替换、区间求最大值】

    I Hate It Time Limit:3000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u Submit St ...

  4. mongo 多条件or

    or语句 or b=2 > db.XXX.find({"$or":[{"a":1}, {"b":2}]});  等于java mong ...

  5. C++程序设计基础（5）sizeof的使用

    1.知识点 (1)sizeof是一个单目运算发,而不是一个函数,其用于获取操作数所占内存空间的字节数. (2)sizeof的操作数可以使类型名,也可以是表达式,如果是类型名则直接获得该类型所占字节数, ...

  6. 20个最受欢迎的Linux命令（转）

    本文根据 commandlinefu 网站的历史排名,筛选出了前 20 个得票最高的 Linux 命令.看看你都能熟练使用了吗? 1.以 root 帐户执行上一条命令 sudo !! 2.利用 Pyt ...

  7. spring mvc 外键允许Null

    spring mvc 定义模型外键时允许为Null 新手记录,习惯定义模型时将外键的数据类型为long,基本类型. 这样生成的外键是不允许为Null,但是可以通过设置字段的Column注解,使之允许为 ...

  8. [转]MVC系列——MVC源码学习：打造自己的MVC框架（一：核心原理）

    本文转自:http://www.cnblogs.com/landeanfen/p/5989092.html 阅读目录 一.MVC原理解析 1.MVC原理 二.HttpHandler 1.HttpHan ...

  9. C#中的MD5加密

    1 using System.Web.Security; 2  string pswd = FormsAuthentication.HashPasswordForStoringInConfigFile ...

  10. 服务器LIUNX之如何解决矿机问题

    点进来的基本都是遇到liunx变矿机的小伙伴吧(cpu运载300%) 卡的连终端都很难打开 开下来之后提示 大意是, 到xxx网站给钱了事, 不过基本这个网站基本也上不去, 要么是暴力破解, 要么是通 ...