是否可以在没有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
{ “名”: “kitica”}
但消息永远不会回到用户身上.
angular2在端口8001上,弹簧支架在8080上
令人困惑的部分是我使用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(); } }