angular2无法发送信息给弹簧踩踏websocket

时间:2016-10-07 05:48:52

标签: angular stomp spring-websocket

我使用弹簧踩踏websocket 8080 port和angular2 4200 port

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {

    @Override
    public void configureMessageBroker(MessageBrokerRegistry config) {
        config.enableSimpleBroker("/topic");
        config.setApplicationDestinationPrefixes("/app");
    }

    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/query/company/socket")
        .setAllowedOrigins("*")
        .withSockJS();
    }

}

和:

@MessageMapping("/hello")
    @SendTo("/topic/greetings")
    public Greeting greeting(HelloMessage message) throws Exception {
        System.out.println(" start is : name is : "+message.getName());
        Thread.sleep(1000); // simulated delay
        return new Greeting("Hello, " + message.getName() + "!");
    }

和angular2:

import * as SockJS from 'sockjs-client';
const Stomp = require('stompjs/lib/stomp').Stomp;
import {BehaviorSubject} from "rxjs";


    export class AppComponent implements OnInit{
      private host='http://localhost:8080';
      private url = `${this.host}/query/company/socket`;
      private subUrl=`${this.host}/topic/greetings`;
      private sendUrl=`${this.host}/app/hello`;
      public stompClient: any;

      ngOnInit(): void {
        this.connect();
      }

      connect() {
        var that = this;
        var socket = new SockJS(this.url);
        this.stompClient = Stomp.over(socket);
        this.stompClient.connect({}, function (frame) {
          console.log('Connected: ' + frame);
          that.stompClient.subscribe(this.subUrl, function (greeting) {
            console.log(JSON.parse(greeting.body).content);
          });
        }, function (err) {
          console.log('err', err);
        });
      }

      public send() {

        this.stompClient.send(this.sendUrl , {},      JSON.stringify({ 'name': 'jack' }));

      }
}

运行时:chrome console ---

Web Socket Opened...
stomp.js:134 >>> CONNECT
accept-version:1.1,1.0
heart-beat:10000,10000


stomp.js:134 <<< CONNECTED
version:1.1
heart-beat:0,0


stomp.js:134 connected to server undefined
app.component.ts:41 Connected: CONNECTED
heart-beat:0,0
version:1.1


stomp.js:134 >>> SUBSCRIBE
id:sub-0
destination:undefined

>>> SEND
destination:http://localhost:8080/app/hello
content-length:13

{"name":"ll"}
发送消息时

弹簧控制台:

WebSocketSession[1 current WS(1)-HttpStream(0)-HttpPoll(0), 1 total, 0 closed abnormally (0 connect failure, 0 send limit, 0 transport error)], stompSubProtocol[processed CONNECT(1)-CONNECTED(1)-DISCONNECT(0)], stompBrokerRelay[null], inboundChannel[pool size = 0, active threads = 0, queued tasks = 0, completed tasks = 9], outboundChannelpool size = 0, active threads = 0, queued tasks = 0, completed tasks = 1], sockJsScheduler[pool size = 4, active threads = 1, queued tasks = 2, completed tasks = 441]

从前面发送消息时,应打印出弹簧:

System.out.println(" start is : name is : "+message.getName());

但不是..

angular2没有收到任何回复..

2 个答案:

答案 0 :(得分:1)

我已经解决了。

虽然我的angular2和spring使用不同的端口,4200,8080。

当我改变

private host='http://localhost:8080';
 private subUrl=`${this.host}/topic/greetings`;
private sendUrl=`${this.host}/app/hello`;

private subUrl='/topic/greetings';
private sendUrl='/app/hello';

它工作正常,

但我不知道原因。

答案 1 :(得分:1)

我在不同服务器上运行的2个应用程序遇到了同样的问题。无论角度如何,我也以这种方式注册了客户:

...
var socket = new SockJS('http://localhost:8099/websocket');
...
stompClient.subscribe('http://localhost:8099/ws/update', function (msg){
   console.log("received:", msg.body);
});

使用该绑定,即使我的浏览器套接字工具列出了消息,我也没有从服务器收到任何答案。 但由于某种原因,订阅部分应该没有主机。现在我的代码看起来像这样:

...
var socket = new SockJS('http://localhost:8099/websocket');
...
stompClient.subscribe('/ws/update', function (msg){
   console.log("received:", msg.body);
});