我使用弹簧踩踏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没有收到任何回复..
答案 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);
});