我正在学习使用Spring 5的websockets。我使用this tutorial。但是当我尝试通过JavaScript连接到websocket时,我有以下错误:
WebSocket connection to 'ws://localhost:8080/event-emitter' failed: Error during WebSocket handshake: Unexpected response code: 404
当我尝试通过Java连接到websocket时,我有以下错误:
Exception in thread "main" reactor.ipc.netty.http.client.HttpClientException: HTTP request failed with code: 404.
Failing URI: /event-emitter
Suppressed: java.lang.Exception: #block terminated with an error
at reactor.core.publisher.BlockingSingleSubscriber.blockingGet(BlockingSingleSubscriber.java:126)
at reactor.core.publisher.Mono.block(Mono.java:1185)
我的 ReactAndSpringDataRestApplication.java :
@SpringBootApplication
public class ReactAndSpringDataRestApplication {
@Autowired
private ReactiveWebSocketHandler webSocketHandler;
public static void main(String[] args) {
SpringApplication.run(ReactAndSpringDataRestApplication.class, args);
}
@Bean
public HandlerMapping webSocketHandlerMapping() {
Map<String, WebSocketHandler> map = new HashMap<>();
map.put("/event-emitter", webSocketHandler);
SimpleUrlHandlerMapping handlerMapping = new SimpleUrlHandlerMapping();
handlerMapping.setOrder(1);
handlerMapping.setUrlMap(map);
return handlerMapping;
}
@Bean
public WebSocketHandlerAdapter handlerAdapter() {
return new WebSocketHandlerAdapter();
}
}
ReactiveWebSocketHandler.java :
@Component
public class ReactiveWebSocketHandler implements WebSocketHandler {
private static final ObjectMapper json = new ObjectMapper();
private Flux<String> eventFlux = Flux.generate(sink -> {
EventTwo event = new EventTwo(Double.toString(Math.random()), new Date().toString());
try {
sink.next(json.writeValueAsString(event));
} catch (JsonProcessingException e) {
sink.error(e);
}
});
private Flux<String> intervalFlux = Flux.interval(Duration.ofMillis(1000L))
.zipWith(eventFlux, (time, event) -> event);
@Override
public Mono<Void> handle(WebSocketSession webSocketSession) {
return webSocketSession.send(intervalFlux
.map(webSocketSession::textMessage))
.and(webSocketSession.receive()
.map(WebSocketMessage::getPayloadAsText)
.log());
}
}
试图连接到websocket的JavaScript:
import React, {Component} from 'react';
import { connect } from 'react-redux';
import '../res/messages.css';
class Messages extends Component {
constructor(props) {
super(props);
this.state = {messages: []};
}
getInitialState(){
return { messages : [] }
}
componentDidMount() {
var clientWebSocket = new WebSocket("ws://localhost:8080/event-emitter");
clientWebSocket.onopen = function() {
console.log("clientWebSocket.onopen", clientWebSocket);
console.log("clientWebSocket.readyState", "websocketstatus");
clientWebSocket.send("event-me-from-browser");
}
clientWebSocket.onclose = function(error) {
console.log("clientWebSocket.onclose", clientWebSocket, error);
}
clientWebSocket.onerror = function(error) {
console.log("clientWebSocket.onerror", clientWebSocket, error);
}
clientWebSocket.onmessage = function(error) {
console.log("clientWebSocket.onmessage", clientWebSocket, error);
this.setState({
messages : this.state.messages.concat([ new Date() ])
})
}
}
render() {
return (
<div><ul>{ this.state.messages.map( (msg, idx) => <li key={'msg-' + idx }>{ msg }</li> )}</ul></div>
)
}
}
在Java端\ Spring中是否应该有其他websockets配置?为什么客户端无法连接到服务器?
答案 0 :(得分:0)
我使用了其他guide的配置。
我创建了ChatSocketHandler.java,ReactiveChatApplication.java而没有 userStats()。
我的 Event.java :
@Data
public class Event {
private String eventId;
private String eventDt;
public Event() {
}
public Event(String eventId, String eventDt) {
this.eventId = eventId;
this.eventDt = eventDt;
}
public String getEventId() {
return eventId;
}
public void setEventId(String eventId) {
this.eventId = eventId;
}
public String getEventDt() {
return eventDt;
}
public void setEventDt(String eventDt) {
this.eventDt = eventDt;
}
}
我的JavaScript文件:
import React, {Component} from 'react';
import { connect } from 'react-redux';
import '../res/messages.css';
const client = require('../client');
class Messages extends Component {
constructor(props) {
super(props);
this.state = {messages: []};{messages: []};
}
getInitialState(){
return { messages : [] }
}
updateMessages(msg){
this.setState({
messages : this.state.messages.concat([ msg ])
})
}
componentDidMount() {
var clientWebSocket = new WebSocket("ws://127.0.0.1:8080/websocket/chat");
clientWebSocket.onopen = function() {
console.log("clientWebSocket.onopen", clientWebSocket);
console.log("clientWebSocket.readyState", "websocketstatus");
clientWebSocket.send("event-me-from-browser");
}
clientWebSocket.onclose = function(error) {
console.log("clientWebSocket.onclose", clientWebSocket, error);
}
clientWebSocket.onerror = function(error) {
console.log("clientWebSocket.onerror", clientWebSocket, error);
}
var tmpMsg;
var _this = this;
clientWebSocket.onmessage = function(dataFromServer) {
console.log("clientWebSocket.onmessage", clientWebSocket, dataFromServer);
var date = new Date() ;
tmpMsg = dataFromServer;
_this.updateMessages(tmpMsg);
}
}
render() {
return (
<div>
<ul>{ this.state.messages.map( (msg) =>
<li>{ JSON.parse(msg.data).eventDt }</li> )}
</ul>
</div>
)
}
答案 1 :(得分:0)
您是否在上下文(@Bean)上添加了WebSocketHandlerAdapter类?如果没有,请尝试在上下文中添加WebSocketHandlerAdapter类。
private final WebSocketHandler webSocketHandler;
@Bean
public HandlerMapping webSocketHandlerMapping() {
Map<String, WebSocketHandler> map = new HashMap<>();
map.put("/event-emitter", webSocketHandler);
SimpleUrlHandlerMapping handlerMapping = new SimpleUrlHandlerMapping();
handlerMapping.setOrder(1);
handlerMapping.setUrlMap(map);
return handlerMapping;
}
@Bean
public WebSocketHandlerAdapter handlerAdapter() {
return new WebSocketHandlerAdapter();
}