我正在使用一個簡單的 html 頁面（使用 javascript）作為前端和一個用于我的 api 的 Spring Boot 應用程式作為后端進行一個小測驗專案。我使用帶有 stomp 和 sockJS 的 websocket 來保持我的前后連接。我的問題如下：當我測驗與 Postman 的連接時，我沒有問題，但是當我從我的 javascript 呼叫 api 時，出現以下錯誤：https : //i.stack.imgur.com/UII2g.png
我嘗試了我在互聯網上找到的所有解決方案，現在我被卡住了
這是我的 Spring Boot App_controller ：
@RestController
@CrossOrigin(origins = "*")
public class App_Controller {
int id = 0;
ArrayList<Player> players = new ArrayList<Player>();
public void addTab(Player p){
players.add(p);
}
@MessageMapping("/batch-socket")
@SendTo("/topic/messages")
public String send(String message) throws Exception {
String time = new SimpleDateFormat("HH:mm").format(new Date());
return (message " : " time);
}
@RequestMapping (value = "/error", produces = MediaType.APPLICATION_JSON_VALUE, method = RequestMethod.GET)
public String error(){
return "erreur";
}
}
這是我的 corsConfiguration ：
@Configuration
public class CorsConfig {
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurer() {
@Override
public void addCorsMappings(CorsRegistry registry){
registry.addMapping("/**")
.allowCredentials(true)
.allowedOrigins("*")
.allowedHeaders("*")
.allowedMethods("GET", "POST", "PUT", "DELETE")
.maxAge(3600);
}
};
}
}
這是我的 WebSocketConfiguration ：
@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {
@Override
public void configureMessageBroker(MessageBrokerRegistry config) {
config.setApplicationDestinationPrefixes("/topic")
.enableSimpleBroker("/app");
}
@Override public void registerStompEndpoints(StompEndpointRegistry registry) {
registry.addEndpoint("/batch-socket");
registry.addEndpoint("/batch-socket")
.setAllowedOrigins("*")
.withSockJS();
}
}
最后這是我連接到這個 WebSocket 的函式：
function connect(){
var socket = new SockJS("http://localhost:8080/batch-socket");
stompClient = Stomp.over(socket);
stompClient.connect({}, function(frame){
setConnected(true);
console.log('Connected: ' frame);
stompClient.subscribe('/topic/messages', function(msgOutput){
console.log(msgOutput);
})
})
}
我嘗試只添加 @CrossOrigin(origins="*") 和 @CrossOrigins(origins="http://localhost:63342") 并使用我的 CorsConfig 測驗多種可能性。
提前感謝您的幫助（對不起我的英語）
uj5u.com熱心網友回復：
你沒有說你的帶有 JS 的 HTML 頁面是如何加載的。它是同一個 localhost:8080 還是本地檔案？
為了進行測驗，您可以告訴 Chrome 忽略 cors 限制：
chrome --disable-web-security --user-data-dir={some dir}
uj5u.com熱心網友回復：
我認為你不需要創建@bean WebMvcConfigurer corsConfigurer，如果它是一個簡單的測驗。你能做一個測驗洗掉那個bean的注冊并更改注釋的順序嗎？
@CrossOrigin(origins = "http://localhost:63342")
@RestController
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/337284.html
標籤：javascript 弹簧靴 网络套接字 跺脚 袜子
上一篇：當映射到POJO中的Double型別欄位時，JacksonObjectMapper將Integer值轉換為null