是否可以在没有MVC的情况下使用stock over sockjs。所以我想在tomcat中有spring rest接口,而angular2应用程序由express运行。
WebSocketConfig.java
@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {
@Override
public void registerStompEndpoints(StompEndpointRegistry registry) {
// the endpoint for websocket connections
registry.addEndpoint("/portfolio").setAllowedOrigins("*").withSockJS();
}
@Override
public void configureMessageBroker(MessageBrokerRegistry config) {
config.setApplicationDestinationPrefixes("/app");
config.enableSimpleBroker("/topic");
}
}
SocketController.java
@Controller
public class SocketController {
@Autowired
private SimpMessagingTemplate template;
public SocketController() {
int a = 5;
}
@MessageMapping("/greeting")
public String handle(String greeting) {
return "[" + "greeting" + ": " + greeting;
}
}
和打字稿代码:
。 。 。
constructor() {
var socket = new SockJS('http://localhost:8080/portfolio');
this.stompClient = Stomp.over(socket);
this.stompClient.connect("guest", "guest", function(frame) {
console.log('Connected: ' + frame);
this.stompClient.subscribe('http://localhost:8080/topic/greeting', function(greeting) {
console.log("from from", greeting);
});
}, function (err) {
console.log('err', err);
});
}
。 。
send() {
this.stompClient.send("http://localhost:8080/app/greeting", {}, JSON.stringify({ 'name': "kitica" }));
}
。 。
但由于某种原因,这不起作用..在控制台我得到输出:
Opening Web Socket...
stomp.js:134 Web Socket Opened...
stomp.js:134 >>> CONNECT
login:guest
passcode:guest
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
activity-socket.ts:17 Connected: CONNECTED
heart-beat:0,0
version:1.1
当我发送时,我得到了
>>> SEND
destination:http://localhost:8080/app/greeting
content-length:17
{&#34;名称&#34;:&#34; kitica&#34;}
但是消息永远不会回到订阅者身上。
angular2在端口8001上,弹簧支架在8080上
答案 0 :(得分:7)
令人困惑的部分是我使用spring-boot-rest并且我没有将tom2作为静态来自tomcat容器,我在webpack下有angular2所以我不断尝试订阅并发送到相对URL。
正确的方法是:
import {Component} from '@angular/core';
import {ActivityService} from '../common/services';
import {MaterializeDirective} from 'angular2-materialize';
import {LarsActionButtonComponent} from '../common/components';
var SockJS = require('sockjs-client');
var Stomp = require('stompjs');
@Component({
selector: 'activity',
providers: [ActivityService],
directives: [MaterializeDirective, LarsActionButtonComponent],
templateUrl: 'app/activity/activity.html'
})
export class Activity {
stompClient: any;
activityId: any;
text: any;
messages: Array<String> = new Array<String>();
constructor() {
}
send() {
this.stompClient.send('/app/hello/' + this.activityId, {}, JSON.stringify({ 'name': this.text }));
}
connect() {
var that = this;
var socket = new SockJS('tst-rest.mypageexample/hello?activityId=' + this.activityId);
this.stompClient = Stomp.over(socket);
this.stompClient.connect({}, function (frame) {
console.log('Connected: ' + frame);
that.stompClient.subscribe('/topic/greetings/' + that.activityId, function (greeting) {
that.messages.push(JSON.parse(greeting.body).content);
});
}, function (err) {
console.log('err', err);
});
}
}
并在春季控制器中:
@Controller
public class SocketController {
@MessageMapping("/hello")
@SendTo("/topic/greetings")
public Greeting greeting(HelloMessage message) throws Exception {
return new Greeting("Hello, " + message.getName() + "!");
}
}
配置类:
@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("/hello").setAllowedOrigins("*").withSockJS();
}
}
答案 1 :(得分:1)
我自己有一些问题可以使用一个使用SockJs和一个Java spring-boot后端的angular2客户端。在这里我做了什么让它工作:
在角度方面:
this.stompClient.subscribe无法找到,所以绑定&#34;这个&#34;到&#34;那&#34;。
constructor() {
var that = this;
var socket = new SockJS('http://localhost:8080/portfolio');
this.stompClient = Stomp.over(socket);
this.stompClient.connect("guest", "guest", function(frame) {
console.log('Connected: ' + frame);
that.stompClient.subscribe('http://localhost:8080/topic/greeting', function(greeting) {
console.log("from from", greeting);
});
}, function (err) {
console.log('err', err);
});
}
在Java服务器端:
您的控制器需要一个注释,表示返回vallue的位置如下:
@MessageMapping("/greeting")
@SendTo("/topic/greetings")
public String handle(String greeting) {
return "[" + "greeting" + ": " + greeting;
}
根据您的留言经纪人。
希望有所帮助。
答案 2 :(得分:0)
您已将'handle()'方法值发送给订阅者 要么使用 simpMessagingTemplate.convertAndSend(,); eg-simpMessagingTemplate.convertAndSend(“/ topic / chats”,message.getMessage());
或 处理程序方法上方的@SendTo(“目标网址”)。 eg- @SendTo(“/ topic / message”)