JS + Rabbitmq

  1. rabbitmq-plugins enable rabbitmq_management rabbitmq_web_stomp rabbitmq_stomp rabbitmq_web_stomp_examples
  1. <html>
  2. <head>
  3.     <title>WebSocket</title>
  4.     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5.     <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  6.     <!-- stomp协议的客户端脚本 -->
  7.     <script src="https://cdn.bootcdn.net/ajax/libs/stomp.js/2.3.3/stomp.min.js"></script>
  8.     <!-- SockJS的客户端脚本 -->
  9.     <script src="https://cdn.bootcdn.net/ajax/libs/sockjs-client/1.5.1/sockjs.min.js"></script>
  10. </head>
  11. <body>
  12.     <div id="main">
  13.         <div id="message"></div>
  14.     </div>
  15. </body>
  16. <script type="text/javascript">
  17.     var ws = new WebSocket('ws://47.97.214.127:15674/ws');
  18.     // 获得Stomp client对象
  19.     var client = Stomp.over(ws);
  21.     client.heartbeat.outgoing = 0;
  22.     client.heartbeat.incoming = 0;
  24.     // 定义连接成功回调函数
  25.     var on_connect = function (x) {
  26.         //data.body是接收到的数据
  27.         client.subscribe("/queue/warning", function (data) {
  28.             var msg = data.body;
  29.             $("#message").append("收到数据：" + msg);
  30.         });
  31.     };
  32.     // 定义错误时回调函数
  33.     var on_error = function () {
  34.         console.log('error');
  35.     };
  36.     // 连接RabbitMQ
  37.     client.connect('admin', 'admin', on_connect, on_error, '/');
  38. </script>
  39. </html>