【发布时间】：2016-05-11 14:48:52
【问题描述】：
我正在做一个 Angular 应用程序来显示为 spring 服务器连续发送的数据。我的 Angular 应用程序连接正确，但我不知道如何订阅服务器正在发送的数据。我给你看我的代码：
服务器、WebSocketConfiguration：
...
@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfiguration implements WebSocketMessageBrokerConfigurer {
@Override
public void registerStompEndpoints(final StompEndpointRegistry registry){
registry.addEndpoint("/random")
.setAllowedOrigins("*")
.withSockJS();
}
....
服务器、数据生成器：
...
@SuppressWarnings("deprecation")
@Component
public class JapcDataGenerator implements ApplicationListener<BrokerAvailabilityEvent> {
[...]
public void sendDataUpdates(int val) {
System.out.println("sending : " + val);
this.messagingTemplate.convertAndSend("/data", val);
}
...
客户端，index.html：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us" lang="en-us">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>WebSocket chart example</title>
</head>
<body ng-app="WebSocketAngularApp">
<div ng-controller="socktCtrl">
<p>{{data}}</p>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script type="text/javascript" src="node_modules/angular-websocket/angular-websocket.js"></script>
<script type="text/javascript" src="resources/application.js" ></script>
</body>
</html>
客户端应用程序.js：
var socktApp = angular.module('WebSocketAngularApp',['ngWebSocket']);
socktApp.factory('mySockt',function($websocket){
var ws = $websocket('ws://137.138.245.169:8888/serverEx/random/websocket');
var collection = [];
ws.onMessage( function(message){
console.info("message: ", message);
collection.push(JSON.parse(message.data));
});
ws.onOpen( function(message){
console.log("Connection open!",message);
});
ws.onClose( function(){
console.log("Closing the socket.")
});
ws.onError( function(message){
console.info("Error in socket", message);
});
var methods = {
collection: collection,
get: function(){
ws.send( JSON.stringify({action: 'data'}) );
}
};
return methods;
});
socktApp.controller ('socktCtrl', function($scope, mySockt){
$scope.data = mySockt;
});
结果显示连接日志，但从来没有消息，因为我不知道如何订阅此数据流（行：this.messagingTemplate.convertAndSend("/data", val);）。
【问题讨论】：
标签： javascript angularjs websocket