java WebSocket实现Java后台消息推送

3 篇文章 0 订阅
1 篇文章 0 订阅

1.什么是WebSocket

  WebSocket协议是基于TCP的一种新的网络协议。它实现了浏览器与服务器全双工(full-duplex)通信——允许服务器主动发送信息给客户端。

2.实现原理

  在实现websocket连线过程中,需要通过浏览器发出websocket连线请求,然后服务器发出回应,这个过程通常称为“握手” 。在 WebSocket API,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。

                        

3.优点

  在以前的消息推送机制中,用的都是 Ajax 轮询(polling),在特定的时间间隔由浏览器自动发出请求,将服务器的消息主动的拉回来,这种方式是非常消耗资源的,因为它本质还是http请求,而且显得非常笨拙。而WebSocket 在浏览器和服务器完成一个握手的动作,在建立连接之后,服务器可以主动传送数据给客户端,客户端也可以随时向服务器发送数据。

4.WebSocket和Socket的区别

  1.WebSocket: 

    1. websocket通讯的建立阶段是依赖于http协议的。最初的握手阶段是http协议,握手完成后就切换到websocket协议,并完全与http协议脱离了。

    2. 建立通讯时,也是由客户端主动发起连接请求,服务端被动监听。

    3. 通讯一旦建立连接后,通讯就是“全双工”模式了。也就是说服务端和客户端都能在任何时间自由得发送数据,非常适合服务端要主动推送实时数据的业务场景。

    4. 交互模式不再是“请求-应答”模式,完全由开发者自行设计通讯协议。

    5. 通信的数据是基于“帧(frame)”的,可以传输文本数据,也可以直接传输二进制数据,效率高。当然,开发者也就要考虑封包、拆包、编号等技术细节。

  2.Socket:

    1. 服务端监听通讯,被动提供服务;客户端主动向服务端发起连接请求,建立起通讯。

    2. 每一次交互都是:客户端主动发起请求(request),服务端被动应答(response)。

    3. 服务端不能主动向客户端推送数据。

    4. 通信的数据是基于文本格式的。二进制数据(比如图片等)要利用base64等手段转换为文本后才能传输。

5.WebSocket客户端:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

var websocket = null;

var host = document.location.host; 

var username = "${loginUsername}"// 获得当前登录人员的userName 

 // alert(username)

//判断当前浏览器是否支持WebSocket 

if ('WebSocket' in window) { 

    alert("浏览器支持Websocket")

    websocket = new WebSocket('ws://'+host+'/mm-dorado/webSocket/'+username); 

else 

    alert('当前浏览器 Not support websocket'

 

//连接发生错误的回调方法 

websocket.onerror = function() { 

  alert("WebSocket连接发生错误")

   setMessageInnerHTML("WebSocket连接发生错误"); 

};  

   

//连接成功建立的回调方法 

websocket.onopen = function() {

  alert("WebSocket连接成功"

   setMessageInnerHTML("WebSocket连接成功"); 

   

//接收到消息的回调方法 

websocket.onmessage = function(event) {

    alert("接收到消息的回调方法"

    alert("这是后台推送的消息:"+event.data);

     websocket.close();

    alert("webSocket已关闭!")

   

//连接关闭的回调方法 

websocket.onclose = function() { 

    setMessageInnerHTML("WebSocket连接关闭"); 

   

//监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。 

window.onbeforeunload = function() { 

    closeWebSocket(); 

   

//关闭WebSocket连接 

function closeWebSocket() { 

    websocket.close(); 

 

//将消息显示在网页上

    function setMessageInnerHTML(innerHTML) {

        document.getElementById('message').innerHTML += innerHTML + '<br/>';

    }

  6.WebSocket服务端(java后台):

    1.核心类:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

package com.mes.util;

 

import java.io.IOException;

import java.util.Map;

import java.util.concurrent.ConcurrentHashMap;

 

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;

 

import org.springframework.stereotype.Component;

import org.springframework.stereotype.Service;

 

import com.google.gson.JsonObject;

 

import net.sf.json.JSONObject;

@ServerEndpoint("/webSocket/{username}")  

    public class WebSocket { 

        private static int onlineCount = 0

        private static Map<String, WebSocket> clients = new ConcurrentHashMap<String, WebSocket>(); 

        private Session session; 

        private String username; 

           

        @OnOpen 

        public void onOpen(@PathParam("username") String username, Session session) throws IOException { 

       

            this.username = username; 

            this.session = session; 

               

            addOnlineCount(); 

            clients.put(username, this);

            System.out.println("已连接");

        

       

        @OnClose 

        public void onClose() throws IOException { 

            clients.remove(username); 

            subOnlineCount(); 

        

       

        @OnMessage 

        public void onMessage(String message) throws IOException { 

       

            JSONObject jsonTo = JSONObject.fromObject(message); 

            String mes = (String) jsonTo.get("message");

             

            if (!jsonTo.get("To").equals("All")){ 

                sendMessageTo(mes, jsonTo.get("To").toString()); 

            }else

                sendMessageAll("给所有人"); 

            

        

       

        @OnError 

        public void onError(Session session, Throwable error) { 

            error.printStackTrace(); 

        

       

        public void sendMessageTo(String message, String To) throws IOException { 

            // session.getBasicRemote().sendText(message); 

            //session.getAsyncRemote().sendText(message); 

            for (WebSocket item : clients.values()) { 

                if (item.username.equals(To) ) 

                    item.session.getAsyncRemote().sendText(message); 

            

        

           

        public void sendMessageAll(String message) throws IOException { 

            for (WebSocket item : clients.values()) { 

                item.session.getAsyncRemote().sendText(message); 

            

        

       

        public static synchronized int getOnlineCount() { 

            return onlineCount; 

        

       

        public static synchronized void addOnlineCount() { 

            WebSocket.onlineCount++; 

        

       

        public static synchronized void subOnlineCount() { 

            WebSocket.onlineCount--; 

        

       

        public static synchronized Map<String, WebSocket> getClients() { 

            return clients; 

        

}

  2.在自己代码中的调用:

1

2

3

4

5

WebSocket ws = new WebSocket();

JSONObject jo = new JSONObject();

jo.put("message""这是后台返回的消息!");

jo.put("To",invIO.getIoEmployeeUid());

ws.onMessage(jo.toString());

  7.所需maven依赖:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

<!-- webSocket 开始-->

<dependency>

    <groupId>javax.websocket</groupId>

    <artifactId>javax.websocket-api</artifactId>

    <version>1.1</version>

    <scope>provided</scope>

</dependency>

 

<dependency>

    <groupId>javax</groupId>

    <artifactId>javaee-api</artifactId>

    <version>7.0</version>

    <scope>provided</scope>

</dependency>

<!-- webSocket 结束-->

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 可以使用 websocket 在前后端进行实时通信。要在 Java实现 websocket,可以使用 Java API for WebSocket(JSR 356)。 要在 Vue 中使用 websocket,可以使用第三方库,例如 vue-socket.io。 示例代码: Java 服务端: ```java import javax.websocket.OnClose; import javax.websocket.OnMessage; import javax.websocket.OnOpen; import javax.websocket.Session; import javax.websocket.server.ServerEndpoint; @ServerEndpoint("/websocket") public class WebSocketServer { @OnOpen public void onOpen(Session session) { System.out.println("Open a new session: " + session.getId()); } @OnMessage public void onMessage(String message, Session session) { System.out.println("Receive a message: " + message); } @OnClose public void onClose(Session session) { System.out.println("Close a session: " + session.getId()); } } ``` Vue 客户端: ```javascript import Vue from 'vue'; import VueSocketIO from 'vue-socket.io'; Vue.use(new VueSocketIO({ debug: true, connection: 'http://localhost:8080/websocket', })); new Vue({ el: '#app', data: { message: '', }, methods: { sendMessage() { this.$socket.emit('send message', this.message); this.message = ''; }, }, }); ``` 在这个示例中,Java 服务端会监听 `/websocket` 路径,Vue 客户端会连接到这个路径。当 Vue 客户端调用 `sendMessage` 方法时,会向服务端发送 `send message` 事件,服务端会收到并打印消息。 ### 回答2: 使用WebSocket可以实现实时消息推送功能。下面是使用Java和Vue实现后台消息推送的简单流程: 1. 后台Java实现: 首先,需要创建一个WebSocket处理器类,可以使用Java中的WebSocket API或开源库(如Spring WebSocket)来简化实现。 在WebSocket处理器类中,需要定义连接建立、断开和接收消息等方法,并添加注解以映射监听的消息路径,并处理相应的业务逻辑。 2. 前端Vue实现: 在Vue中,可以使用WebSocket对象来与后台建立连接,并监听消息的到达。 需要在Vue的钩子函数中创建WebSocket对象,并注册回调函数处理后台发送消息。 当收到消息时,可以将其展示在前端页面的相应位置。 3. 后台推送消息: 在后台的相关业务逻辑中,可以通过WebSocket的连接向前端发送消息。 可以在需要推送消息的地方,通过获取对应的WebSocket连接,并使用WebSocket对象的send方法将消息发送至前端。 需要注意的是,WebSocket是基于TCP协议的全双工通信协议,所以需要确保后台服务器和前端浏览器都支持WebSocket。 以上是一个简单的实现示例,实际项目中还需要根据具体需求进行扩展和优化。希望能帮到你! ### 回答3: 要使用WebSocket实现后台消息推送,需要进行以下步骤: 1. 在后台使用Java语言创建WebSocket服务器。可以使用Java内置的WebSocket API或者第三方库,如Tomcat的WebSocket实现等。具体方式可以通过搜索相关教程了解。 2. 在Vue前端应用中,使用WebSocket连接到后台服务器。可以使用Vue插件,如vue-native-websocket或者自己编写相关逻辑。具体方式可以通过搜索相关教程了解。 3. 后台服务器接收Vue前端应用的WebSocket连接请求,并处理连接逻辑。 4. 在后台服务器向Vue前端应用发送消息时,通过WebSocket向已连接的Vue客户端发送消息后台服务器可以根据消息类型和接收者,选择性地发送消息给指定的客户端。 5. Vue前端应用接收到后台服务器发送消息后,进行逻辑处理,如显示消息内容或者执行其他相应操作。 需要注意以下几点: 1. 后台服务器需要保持WebSocket连接的活跃性,以便随时向前端应用发送消息。可以使用定时任务或者其他方式来检测和维持连接。 2. Vue前端应用需要在合适的时机关闭WebSocket连接,以释放资源。可以在Vue组件的生命周期钩子函数中处理关闭连接的逻辑。 总之,通过WebSocket实现后台消息推送,涉及到后台服务器的建立和维护,以及前端应用的连接和消息处理。可以根据实际需求选择合适的技术和工具,完成消息推送功能。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值