如何使用 stomp.js 在 javascript 中使用 Web 套接字消息?

     2023-02-16     153

关键词:

【中文标题】如何使用 stomp.js 在 javascript 中使用 Web 套接字消息?【英文标题】:How to consume web socket messages in javascript using stomp.js? 【发布时间】:2016-06-30 13:12:04 【问题描述】:

我需要使用 stomp.js 库在 Javascript 中使用 Web 套接字消息。

我有这个代码结构......

<!DOCTYPE HTML>
<html>
 <head>
   <title>Client Stomp</title>
   <script src="js/stomp.js"></script>
 </head>
 <body>
   <script>
       var urlServer;
       var topics;
       urlServer = "ws://myserver.com/ws"; 
       topics = "/topic/output.values";
       client = Stomp.client(urlServer);
       client.connect("usr" , "pwd" , connectCallBack, errorCallback);

       function connectCallBack(x) 
           client.subscribe(topics, messageCallback);
       

       function errorCallback(x) 
         // manage connection errors 

       

      function messageCallback(x) 
           // manage message returned 
      
     </script>
 </body>
</html>

....而且我可以在我的网络浏览器控制台中看到返回的消息,所以像这样...

message-id:ID:sdnet-mb1-45259-1466517935373-3947:1:1:1:751006
destination:/topic/output.4c5d7481-fa5e-4f2f-d26d-d4e8095b9dd2_s_01
timestamp:1467279400475
expires:0
subscription:sub-0
persistent:true
priority:4

"sensor":"4c5d7481-fa5e-4f2f-d26d-d4e8095b9dd2","stream":"s_01","values":["time":"2016-06-30T11:36:39+0200","components":"b_6300_Hz":"56.6","b_50_Hz":"16.0","b_3150_Hz":"65.7","b_31_5_Hz":"12.9","b_500_Hz":"60.1","b_400_Hz":"54.5","b_160_Hz":"52.4","b_10000_Hz":"-11.8","b_8000_Hz":"45.6","b_80_Hz":"29.1","b_20000_Hz":"-9.5","b_5000_Hz":"59.4","b_1600_Hz":"67.4","b_1000_Hz":"61.6","b_20_Hz":"17.9","b_125_Hz":"40.5","b_40_Hz":"16.0","b_4000_Hz":"62.7","b_12500_Hz":"-10.6","b_25_Hz":"12.9","b_250_Hz":"55.5","LAeq":"75.2","b_630_Hz":"57.9","b_315_Hz":"55.7","b_200_Hz":"47.6","b_2000_Hz":"67.4","b_63_Hz":"29.1","b_100_Hz":"34.8","b_16_Hz":"17.9","b_1250_Hz":"60.6","b_800_Hz":"66.5","b_16000_Hz":"-9.3","b_2500_Hz":"62.6"]

每 10 秒。

如何在我的 Javacript 代码中使用这些消息?例如,我如何回显 b_6300_Hz 值?

任何建议/示例将不胜感激。

切萨雷

【问题讨论】:

【参考方案1】:

解决方法很简单.....

x.body

... 是消息体,所以

"sensor":"4c5d7481-fa5e-4f2f-d26d-d4e8095b9dd2","stream":"s_01","values":["time":"2016-06-30T11:36:39+0200","components":"b_6300_Hz":"56.6","b_50_Hz":"16.0","b_3150_Hz":"65.7","b_31_5_Hz":"12.9","b_500_Hz":"60.1","b_400_Hz":"54.5","b_160_Hz":"52.4","b_10000_Hz":"-11.8","b_8000_Hz":"45.6","b_80_Hz":"29.1","b_20000_Hz":"-9.5","b_5000_Hz":"59.4","b_1600_Hz":"67.4","b_1000_Hz":"61.6","b_20_Hz":"17.9","b_125_Hz":"40.5","b_40_Hz":"16.0","b_4000_Hz":"62.7","b_12500_Hz":"-10.6","b_25_Hz":"12.9","b_250_Hz":"55.5","LAeq":"75.2","b_630_Hz":"57.9","b_315_Hz":"55.7","b_200_Hz":"47.6","b_2000_Hz":"67.4","b_63_Hz":"29.1","b_100_Hz":"34.8","b_16_Hz":"17.9","b_1250_Hz":"60.6","b_800_Hz":"66.5","b_16000_Hz":"-9.3","b_2500_Hz":"62.6"]

【讨论】:

stompjs使用文档总结(代码片段)

...上得到广泛地应用。一、创建STOMP客户端1、在web浏览器中使用普通的WebSocket  STOMPjavascript客户端会使用ws://的URL与STOMP服务端进行交互。  为了创建一个STOMP客户端js对象,你需要使用Stomp.client(url),而这个URL连接着服务端的We... 查看详情

Angular2 与 Stomp.js

...问题描述】:我正在寻找Stomp.js或类似的库。我没有发现使用angular2.rc6/final示例或lib。我怎样才能重新放置Stomp.js其他东西?在我之前的Angular1.X项目中,我使用Stomp.js和Sock。我卡住了。。更新我尝试了这个示例应用程序,但没有... 查看详情

带有 websocket 和 stockjs 的 JBOSS eap 6.3 beta - 使用 spring 框架的 stomp.js

】带有websocket和stockjs的JBOSSeap6.3beta-使用spring框架的stomp.js【英文标题】:JBOSSeap6.3betawithwebsocketandstockjs-stomp.jsusingspringframework【发布时间】:2014-06-0313:52:19【问题描述】:我正在使用支持websocket的jbosseap6.3,连接显然可以工作,... 查看详情

STOMP 上的重复事件 Socket.io 和 Node.js

...一个服务器,该服务器通过STOMP协议连接到ActiveMQ代理,使用stomp-jsnode.js模块接收事件;然后使用socket.io通 查看详情

Spring websocket 和 Stomp.js - 我应该在订阅和发送之间等待多长时间?

】Springwebsocket和Stomp.js-我应该在订阅和发送之间等待多长时间?【英文标题】:SpringwebsocketandStomp.js-howlongshouldiwaitbetweensubscribeandsend?【发布时间】:2014-08-3010:38:15【问题描述】:我有以下代码(来自springwebsocket演示应用程序):... 查看详情

TypeError:ws.onopen 不是 stomp-node.js 中的函数

...ode.js【发布时间】:2019-02-0204:56:06【问题描述】:我需要使用nodejs为javascript运行stomp客户端并通过websocket发送stomp消息。我有一个js文件send.js:varStomp=require(\'stomp 查看详情

vue项目集成stomp.js接收artemis消息推送(代码片段)

...件linkparam.js文件3.在所需要的vue页面引入4.在组件中应用stomp.js5.创建成功1.安装依赖npminstallstompjsnpminstall--savenet2.新建连接需要的配置文件linkparam.js文件/***配置文件,记录系统中固定的参数*/exportconstMQTT_SERVICE= 查看详情

spring+stomp+activemq实现websocket长连接

stomp.js+spring+sockjs+activemq实现websocket长连接,使用java配置。pom.xml(只列出除了spring基本依赖意外的依赖,spring-version为4.3.3.RELEASE):<dependency><groupId>javax.websocket</groupId><artifactId>java 查看详情

javascrip实现:如何写出漂亮的条件表达式

...!本文分享自华为云社区《如何写出漂亮的条件表达式-JavaScript实现篇》,原文作者:查尔斯。条件表达式,是我们在coding过程中永远躲不开的问题,也是我们骗代码行数最方便的东西(狗头.jpg),但作为一名程序员,我们也要... 查看详情

javascrip的入门基础1

1.1 JS的插入使用<script>标签在HTML网页中插入JavaScript代码,<script>标签要成对出现,并把JavaScript代码写在<script></script>之间。<scripttype="text/javascript">表示在<script></script>之间的是文本类 查看详情

带有 stomp js 的 Spring Boot Websocket:我不断收到哎呀!与 http://localhost:8080/ws 的连接丢失

】带有stompjs的SpringBootWebsocket:我不断收到哎呀!与http://localhost:8080/ws的连接丢失【英文标题】:SpringbootWebsocketwithstompjs:IkeepgettingWhoops!Lostconnectiontohttp://localhost:8080/ws【发布时间】:2018-05-0408:54:09【问题描述】:我想将聊天集成... 查看详情

你如何调试 React Native?

...me中进行调试,那么checkmythisanswer请关注此博客。medium.com/javascrip 查看详情

web前端---javascrip基础

avaScrip基础JavaScrip简介第一个JavaScrip代码数据类型运算符数据类型转换流程控制常用内置对象一、JavaScrip简介1.JavaScrip历史背景介绍    布兰登?艾奇(BrendanEich,1961年~),1995年在网景公司,发明的JavaScript。  一开始JavaS... 查看详情

使用 JavaScript 刷新浏览器后如何在一个页面网站中保存部分位置?

】使用JavaScript刷新浏览器后如何在一个页面网站中保存部分位置?【英文标题】:HowtosavesectionpositioninonepagewebsiteafterbrowserrefreshwithJavaScript?【发布时间】:2022-01-1817:46:49【问题描述】:这是一个单页index.html网站。即使在浏览器... 查看详情

javascrip入门第一课

...8"><title>第一种引入方式</title><scripttype="text/javascript">    查看详情

以编程方式在页眉中添加javascrip引用(或完整脚本)

Placejavascriprefernceorcompletejavascriptcodeinpageheaderfromascxoraspxfile.//addreferencelikethis HtmlGenericControlscript1=newHtmlGenericControl("script");script1.Attributes. 查看详情

如何在没有新请求的情况下修改 ajax src 属性?

...代码:<iframeid="dashboard"></iframe><scripttype="text/javascrip 查看详情

jquery stomp websockets服务器重新连接重新初始化

】jquerystompwebsockets服务器重新连接重新初始化【英文标题】:jquerystompwebsocketsserverreconnectionreinitialization【发布时间】:2017-07-0321:11:44【问题描述】:我有一个通过stomp.js文件连接到我的Java后端的websocket应用程序。functionconnect()var... 查看详情